Sondage du mois

Sondage du mois
 

  La connaissance ne vaut que si elle est partagée par tous




 
  Astuce Adobe Photoshop : Raccourci raccourcis claviers : Ctrl Alt Shift K




Les tutoriaux: Index » Jquery » ScriptsJquery » NivoSlider

Introduction

  • Tutoriel posté par Sky
  • 1918 lectures
  • Mis en ligne le 05-08-2010
  • Dernière mise à jour le 04-09-2010
  • Ce tutoriel a été estimé comme simple.


Automatic Translations:
Translate Into English Translate Into German Translate Into Italian Translate Into Spanish Translate Into Portuguese

Nous allons voir dans cet article le slider d'images créé par http://nivo.dev7studios.com/.

Source du script : nivo.dev7studios


Méthodologie


Ce slider est pour moi un des plus jolie trouvé sur la toile.

Comment l'implémenter sur son site ?

Vraiment très simple à mettre en oeuvre !

1 - Insérer les feuilles de style
2 - Insérer Jquery 1.4.2
3 - Insérer nivo slider pack
4 - Insérer vos images dans un div nommé "slider"

Dans le fichier zip joint à cet article vous trouverez tous les fichiers nécessaires à son bon fonctionnement.

Voici le code complet du fichier, il s'agit du slider par défaut. Il est cependant customisé via le fichier custom-nivo-slider.css

CODE HTML


<link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen" />
<link rel="stylesheet" href="custom-nivo-slider.css" type="text/css" media="screen" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
<script src="jquery.nivo.slider.pack.js" type="text/javascript">
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider();
});
</script>

Site officiel

Je vous conseille vivement d'aller voir sur le site officiel.
Vous y trouverez plein de petites choses intéressantes, notamment de multiples options disponibles.

nivo.dev7studios
Notes

  Evaluez le tutorial (2 Votes)

2
0
0

nivo.dev7studios

Pour les questions ou d'éventuelles remarques, dirigez vous vers le forum.

Réagir sur ce tutoriel - [Jquery] NivoSlider

DERNIÈRES PUBLICATIONS DE OPEN-MOUTHED

En direct de open-mouthed.com