Voici un exemple simple permettant d’afficher un système d’onglets sur une page web. Tous les blocs sont cachés sauf un grâce à la fonction javascript toggle_visibility. Le code est réduit au plus simple pour bien comprendre comment cela fonctionne. On peut aussi utiliser jQuery pour gérer ce type d’élément. Voici la fonction toggle_visibility(id), id étant le numéro de l’onglet à afficher : function toggle_visibility(id) { for(i=1;i<=4;i++) document.getElementById('onglet-' + i).style.display = [...]
YoxView est un visualisateur d’images gratuit pour les sites web. Il est écrit en javascript jQuery et il est disponible sous forme d’un plugin jQuery. Il n’est pas compatible avec IE6 mais ses nombreux paramètres possible en font un outils de choix. Voir le site
Pour compresser votre code javascript vous pouvez utiliser ces deux sites : http://refresh-sf.com/yui/ http://javascriptcompressor.com/ Cela vous permettra gagner parfois beaucoup sur la taille finale du fichier javascript mais aussi de rendre moins lisible (si c’est votre but) votre code javascript et ainsi le rendre inutilisable par les visiteurs de votre site.
Simple Image Viewer est un plugin jQuery qui vous permet de faire une galerie épurée et simple avec une transition sympa entre les images. Facile à mettre en place, ce plugin est très léger et vous rendra certainement service. Page du plugin : ICI Demo du plugin : ICI
Il existe de nombreux plugins jQuery pour des des lightbox (présentation d’image, vidéo ou infos au dessus de la page). En voici quelques uns : ColorBox Fancy Zoom for jQuery FancyBox Imagebox (uniquement pour les images) jQuery Lightbox nyroModal Sexy Lightbox2 TopUp
jqFancyTransitions est un plugins pour jQuery qui permet d’afficher un slideshow avec des effets de transitions plutôt sympas et originaux. Il y a plusieurs effets prédéfinis mais vous pouvez aussi créer des effets en modifiant certains paramètres. Paramètres pour la personnalisation : effect: '' // wave, zipper, curtain width: 500 // width of panel height: 332 // height of panel strips: 20 // number of strips delay: 5000 // delay [...]
Un pageslide est un morceau de page qui apparait à droite ou à gauche de votre écran suite à une action. Cela permet d’afficher des informations comme un « à propos » ou même de la documentation concernant la page qu’on visite. Un plugin jQuery vous permet de mettre en place un pageslide en quelques secondes. La page du plugin jQuery La page de démo Un autre pageslider se trouve ici et [...]
La Yahoo! User Interface Library (YUI) est une bibliothèque logicielle écrite en JavaScript et publiée sous licence BSD par Yahoo!. Elle recourt à AJAX, DHTML et DOM, ce qui facilite le développement d’applications web. Elle inclut également plusieurs fonctions permettant d’interagir à la volée avec les ressources CSS[1]. Le développement de YUI a débuté en 2005 et les sites de Yahoo! ont commencé à y recourir à l’été de cette [...]
jQuery iPhone Style est un plugin pour jQuery qui vous permet de remplacer les checkbox classiques par un bouton qui ressemble à ceux de l’iPhone. L’effet est très sympa. Voir le site
jParallax est un module pour jQuery qui permet de simuler de la 3D en superposant plusieurs images (format png avec transparence) et en les faisant bouger en fonction de la position de la souris au dessus de ces images. Pour avoir un exemple parlant vous pouvez aller sur Dezignus et bouger la souris sur le header. Site de jParallax Des démos L’utilisation est relativement simple. Code html : <ul id= »parallax »> [...]