Planète jQuery : l'actualité jQuery, plugins jQuery et tutoriels jQuery en français

Filtrer les articles : Articles du jour - Articles de la semaine - Articles du mois - Tous les articles

Par Js4Design le 20/05/2013 à 19:16

On a tous tendance à dégainer la bibliothèque Javascript jQuery dès que l’occasion se présente. Or, il faut garder à l’esprit que les fonctions intégrées à Javascript en ont sous le pied ! Des exemples ? L’article Native equivalents of jQuery functions fait un tour rapide quelques fonctions jQuery les plus utilisés avec leur équivalent Javascript « natif » bien plus rapide : sélecteurs, manipulation du DOM, classes CSS, modification des propriétés CSS.

Haut de page

Select2 — des menus « select » survitaminés

0 vote

Par Js4Design le 22/04/2013 à 14:30

Select2 est un plugin jQuery qui améliore le look & feel et l’ergonomie de vos menus select (recherche, données distantes et scrolling infini parmi les résultats) — dans le même esprit que Chosen. (Merci Emilien).

Select2 est disponible sur GitHub.

Haut de page

Chosen — Des menus « select » présentables

0 vote

Par Js4Design le 21/04/2013 à 16:10

Chosen est un plugin Javascript qui rend les longues et indigestes listes select bien plus présentables. Au lieu d’obliger vos utilisateurs à faire défiler toutes les options de vos listes, Chosen leur permet de commencer à saisir le début d’un terme pour n’afficher que les résultats pertinents, à valider d’un clic de souris ou via la touche Enter.

→ Chosen est disponible sur GitHub.

Haut de page

DIYSlider — Slider léger et personnalisable

0 vote

Par Js4Design le 18/02/2013 à 16:20

DIYSlider est un script jQuery léger et personnalisable dont le but est de servir de fondations à vos développements de… sliders ! Quelques exemples d’utilisation ici ou là. Le principe est de transformer une série de div en diaporama avec une foultitude d’options, de méthodes et d’évènements, pour une modique taille de 3,56 kb ou 1,14 kb gzippé !

→ DIYSlider est disponible sur Github.

Haut de page

Parcourir le DOM en PHP avec Simple HTML DOM

0 vote

Par Js4Design le 04/02/2013 à 09:28

Simple HTML DOM est un script PHP qui permet de parcourir une page web pour y rechercher n’importe quel élément, aussi simplement qu’avec jQuery. Une ligne suffit pour extraire le contenu qui vous intéresse !

Avec Simple HTML DOM, il est possible de :

Rechercher des éléments,
Modifier le contenu d’un élément,
D’extraire du contenu.

Ainsi, pour rechercher tous les articles présents sur une page, il suffit de quelques lignes, comme par exemple :

// Create DOM from URL
 $html = file_get_html('http://slashdot.org/');
// Find all article blocks
 foreach($html->find('div.article') as $article) {
 $item['title']     = $article->find('div.title', 0)  ->plaintext;
 $item['intro']     = $article->find('div.intro', 0)  ->plaintext;
 $item['details']   = $article->find('div.details', 0)->plaintext;
 $articles[] = $item;
 }
print_r($articles);

Le site propose de nombreux exemples d’utilisation. Toutefois, vous trouverez chez David Walsh un exemple complet pour vérifier si des pages web on été modifiées et vous envoyer un mail le cas échéant.

→ Simple HTML DOM est sur Sourgeforge.

Voir aussi phpQuery pour sélectionner les éléments du DOM côté serveur (via @c2c)

Haut de page

Shapeshift — Grille dynamique Responsive « à la Pinterest »

0 vote

Par Js4Design le 27/01/2013 à 18:10

Shapeshift — très largement inspiré par jQuery Masonry — est un plugin jQuery qui permet de réarranger dynamiquement une collection d’éléments dans une grille au sein d’un container parent. Un exemple de ce comportement existe sur le célèbre Pinterest. Possibilité de faire du Drag & Drop avec les éléments si jQuery UI Draggable / Droppable sont installés. Nécessite également jQuery Touch Punch pour fonctionner sur les périphériques Touch.

→ Rendez-vous sur la démo de Shapeshift.

Haut de page

jsPDF — Génération de PDF avec Javascript

0 vote

Par Js4Design le 15/01/2013 à 12:44

jsPDF est une bibliothèque créée par @MrRio qui nous propose de nombreuses fonctions permettant de générer du PDF. Écrite en Javascript, cette librairie ne sollicite pas le serveur : tout se passe côté client. jsPDF semble idéal pour générer des PDF pour les rapports, les certificats, les tickets et tout ce que vous pourrez imaginer.

Comment ça marche ? Il suffit d’inclure le script entre les balises <head> de votre page web. Fonctionne avec IE6+, Firefox 3+, Chrome, Safari 3+, Opera. Pour les versions inférieures à IE9 le script utilise un objet Flash pour permettre le téléchargement des fichiers PDF.

→ jsPDF est disponible sur Github.

Haut de page

Liquid Slider — Slider responsive HTML5 & CSS3 pour le web et les mobiles

0 vote

Par Js4Design le 05/09/2012 à 21:02

Liquid Slider est un Slider jQuery (avec des morceaux de HTML5 dedans) conçu avec les contraintes des périphériques mobile à l’esprit pour assurer à vos contenus un affichage optimum quelque soit la taille ou la résolution de l’écran de vos visiteurs.

Parmi les fonctionnalités, nous trouvons :

Affichage «Responsive»,
Utilisation des balises HTML de votre choix,
Utilisation des transitions CSS3 pour un affichage rapide sur mobile,
Animations jQuery pour les périphériques non-compatibles avec les transitions CSS3,
Lien vers les slides avec des hashes personnalisables (vers lesquels on peut faire des liens),
Navigation au clavier,
Fonction diaporama avec boutons «stop», «play» et «pause» au survol (hover),
Fonctions de rappel et accès aux fonctions internes,
Scroll automatique,
Optimisé pour HTML5.

→ Liquid Slider est disponible sur Github.

Haut de page

AngularJS — Dynamique HTML ?

0 vote

Par Js4Design le 09/08/2012 à 21:33

AngularJS est un framework Javascript créé par Google qui ambitionne de faciliter le développement d’applications HTML, mieux que ne le font les frameworks Javascript existants. En effet, aucun d’entre eux n’a totalement résolu le problème du HTML qui n’a pas été prévu pour être dynamique. Mieux que jQuery ? Oui, avec AngularJS, il n’y a plus de manipulations de DOM. Le code est limité au strict minimum.

Voyez plutôt :

<!doctype html>
<html ng-app>
<head>
    <script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>
</head>
<body>
    <div>
        <label>Name:</label>
        <input type="text" ng-model="yourName" placeholder="Enter a name here">
        <hr>
        <h1>Hello {{yourName}}!</h1>
    </div>
</body>
</html>

→ AngularJS est disponible sur Github.

Haut de page

jQuery++ — Extension du domaine de jQuery

0 vote

Par Js4Design le 20/07/2012 à 17:59

jQuery++ est un ensemble de fonctions de bas niveau qui étend les fonctions de jQuery. jQuery++ propose deux grandes familles de fonctions : manipulation du DOM et gestion des évènements. Chaque fonctionnalité est disponible à l’unité pour éviter d’alourdir la facture !

Manipulation du DOM

Evènements

jQuery++ est disponible sur Github

Via Arnaud-k

Haut de page

Informations

Abonnement

Participer

Membres

Manipulation du DOM

Evènements