Des menus déroulant avec Chosen

Posted by & filed under JQuery.

Chosen est un plugin jquery qui permet de réaliser des inputs de type select travaillés, et avec un champs de recherche dans les propositions. Voici un exemple de champs select généré avec l’aide de chosen : Le plugin permet une recherche rapide des options par l’utilisateur dans une liste très grande, comme ici avec la… Read more »

Réaliser des tooltips avec qTip2

Posted by & filed under JQuery.

outweb-jquery

QTip2 est un plugin JQuery qui permet de générer des tooltips évoluées simplement. Il s’agit ici de la nouvelle mouture de qTip utilisée par différents grands sites Internet comme Mozilla. Le site du projet propose une démonstration complète qui nous propose de voir le code source de chacun des exemples. Le plugin propose différentes méthodes… Read more »

MQFramework une grille CSS responsive

Posted by & filed under Outils.

outils

MQFramework est un framework CSS qui propose une système de grille en design réactif. C’est-à-dire un design qui s’adapte à la taille de l’écran. MQFramework propose de découper son écran selon 12 tailles différentes : Voici un exemple de code HTML qui utilise le framework : <div class= »container test margin_bottom_15″> <div class= »row clearfix »> <div class= »grid_12″><h4>Default… Read more »

Des captchas plus intuitifs avec MotionCAPTCHA

Posted by & filed under JQuery.

outweb-jquery

MotionCAPTCHA est un plugin JQuery qui permet, grâce à l’utilisation de HTML5, de faire des captchas différents des autres. En effet, plus besoin de lire des textes compliqués pour les recopier. A la place, nous allons proposer à l’utilisateur de dessiner une forme simple à l’aide de sa souris. Il existe plusieurs types de formes… Read more »

Réaliser des titres originaux avec Lettering

Posted by & filed under JQuery.

outweb-jquery

Lettering est un plugin JQuery qui permet de réaliser des titres avec une police originale. Voici un exemple en image du type de typographie obtenu : Au survol du titre, les lettres sont légèrement animées. Voici comment mettre en place un menu comme précédent : Côté HTML: S o m e T i t l… Read more »

Faire des popups non intrusives avec Fancybox

Posted by & filed under JQuery.

outweb-jquery

Aujourd’hui, je vais vous présenter un plugin JQuery très connu mais qui est un des meilleurs dans son style. Fancybox permet de faire des popups non-intrusives avec un design à la MAC OS. Vous l’aurez compris, le design est épuré et sans couleur. Du fait de sa simplicité apparente, on peut facilement l’intégrer sur nos… Read more »

Bootstrap, le framework CSS ultime

Posted by & filed under Framework.

outils

Bootstrap est un framework CSS qui vous permet de mettre en place très simplement un design à la Twitter. En effet, Bootstrap vous permet de réaliser tous les éléments graphiques du design de Twitter : La barre de navigation Les info bulles Les formulaires Les alertes Le layout Bien que cela soit déjà très bien,… Read more »

Modèle de page « en maintenance »

Posted by & filed under JQuery.

outweb-jquery

Si vous avez une mise à jour à faire qui risque de provoquer des erreurs, de type 404 ou autre, pendant le temps de la mise en place, il vaux mieux afficher une page d’avertissement expliquant brièvement la situation à l’utilisateur. Grâce au plugin JQuery lwtCountdown, vous pouvez très simplement ajouter un compte à rebours… Read more »

Faire des chronologies avec Timelinr

Posted by & filed under JQuery.

outweb-jquery

Timelinr est un plugin JQuery qui permet de faire des frises chronologiques dynamiques avec un effet carrousel très simplement. De quoi donner un peu de vie à vos pages d’historique bien souvent faites sous forme de simple liste. Voici en image le résultat obtenu : Pour cela rien de plus simple : Voici le code… Read more »

Système de notification avec ctNotify

Posted by & filed under JQuery.

outweb-jquery

ctNotify est un plugin JQuery qui permet de faire des notifications comme celles de Twitter. C’est-à-dire une barre d’une vingtaine de pixels de haut sur toute la largeur de l’écran comme ci dessous : L’exemple précédent est une notification de type message qui se masque automatiquement au bout de 5 secondes. Il existe aussi les… Read more »