🌍
Français
Marche bien sous Firefox 11, marche pas sous IE9
alors je suis allé récupérer les fichiers sur cette page
http://nivo.dev7studios.com/pricing/
la version gratuite
ensuite sur la racine du site j'ai créé un dossier slideshow dans lequel j'ai mis les fichiers téléchargés
ça c'est la partie facile où j'avais bien compris comment il fallait faire lol
maintenant au niveau de piwigo ce que j'ai fait :
dans localfiles editor --> css j'ai copié ce code
a écrit:
//jquery slideshow
.nivoSlider {
position:relative;
width:850px; /* Change this to your images width */
height:400px; /* Change this to your images height */
background:url(images/loading.gif) no-repeat 50% 50%;
}
.nivoSlider img {
position:absolute;
top:0px;
left:0px;
display:none;
}
.nivoSlider a {
border:0;
display:block;
}
var total = $('#slider img').length;
var rand = Math.floor(Math.random()*total);
$('#slider').nivoSlider({
startSlide:rand
});
ensuite dans pwg stuffs j'ai créé un nouveau bloque personnel dans lequel j'ai copier ce code
a écrit:
<!-- Usually in the <head> section -->
<link rel="stylesheet" href="slideshow/nivo-slider.css" type="text/css" media="screen" /> //mettre le chemin du fichier sur votre site
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="slideshow/jquery.nivo.slider.pack.js" type="text/javascript"></script> // mettre le chemin du fichier sur votre site
<!-- Then somewhere in the <body> section -->
<left><div id="slider" class="nivoSlider">
<a href="http://www.jeremie-jaspart.com/index.php?/category/amboise"><img src="slideshow/image/amboise1.jpg" alt="" title="Château d'Amboise" /></a>
</div></left>
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider({
effect: 'random', // Specify sets like: 'fold,fade,sliceDown'
slices: 20, // For slice animations
boxCols: 10, // For box animations
boxRows: 6, // For box animations
animSpeed: 1000, // Slide transition speed
pauseTime: 3000, // How long each slide will show
startSlide: 0, // Set starting Slide (0 index)
directionNav: true, // Next & Prev navigation
directionNavHide: true, // Only show on hover
controlNav: false, // 1,2,3... navigation
controlNavThumbs: false, // Use thumbnails for Control Nav
controlNavThumbsFromRel: false, // Use image rel for thumbs
controlNavThumbsSearch: '.jpg', // Replace this with...
controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src
keyboardNav: false, // Use left & right arrows
pauseOnHover: true, // Stop animation while hovering
manualAdvance: false, // Force manual transitions
captionOpacity: 0.8, // Universal caption opacity
prevText: 'Prev', // Prev directionNav text
nextText: 'Next', // Next directionNav text
randomStart: true, // Start on a random slide
beforeChange: function(){}, // Triggers before a slide transition
afterChange: function(){}, // Triggers after a slide transition
slideshowEnd: function(){}, // Triggers after all slides have been shown
lastSlide: function(){}, // Triggers when last slide is shown
afterLoad: function(){} // Triggers when slider has loaded
});
});
</script>
il faut ensuite créer un dossier image dans lequel on va mettre les photos retaillé aux dimensions que l'on a choisi pour le diaporama, pour 850x400px il ne faut pas oublier de changer ces valeur au niveau du CSS de localfiles editor
ensuite dans la partie body du code on ajoute autant de fois que de photos ce code
a écrit:
<a href="http://www.jeremie-jaspart.com/index.php?/category/amboise"><img src="slideshow/image/amboise1.jpg" alt="" title="Château d'Amboise" /></a>
lien vers lequel on souhaite que l'on arrive si on clique sur la photo, chemin de la photo et après title le nom que l'on souhaite qui apparaisse sur le bas de la photo dans le diaporama
et ensuite il y a toute la fin du code qui permet de personnaliser un peu le slideshow.
Par contre je viens de tester sur internet explorer et je me rends compte que ça ne fonctionne pas, moi je suis sur firefox pas de soucis.
alors si il y a un expert qui passe par là et qui sait ce qu'il faudrait faire pour que le diaporama fonctionne correctement sur IE ça serait bien.
Et chez vous est ce que vous le voyez s'afficher?
...plus qu'a expliquer pour que cela serve à d'autre ;-)
après plusieurs bidouillages j'ai réussit à intégrer le slideshow
ça semble fonctionner correctement pour le moment :p
Bonjour à tous,
encore moi :p
je ne savais pas où mettre ma question, alors je la pose ici
je voudrais savoir si il est possible de mettre un diaporama style jquery sur ma page et comment faire?
je voudrais quelque chose qui ressemble à cela http://nivo.dev7studios.com/
j'ai essayer de chercher mais je suis un peu perdu car je n'y connais pas grand chose en codage
donc par rapport à ce que j'ai ici ou là sur différents sites, si je veux faire un diaporama dans ce style, si j'ai bien compris, il me faut plusieurs choses :
le fichier jquery
un fichier css
un fichier script
c'est bien ça?
ensuite je lis qu'il faut mettre code html dans la partie head et body de la page.
est ce qu'il faut que je mette cela dans ma page index.php? et à quel endroit?
ensuite les différents fichiers où dois-je les mettre sur mon ftp?
mon gros problème en fait c'est de savoir comment placer toutes ces informations dans les différents dossiers et fichiers pour que ça fonctionne et que ça apparaisse sur ma page.
est qu'il ne risque d'y avoir de conflit avec d'autres applications de piwigo?
Merci d'avance pour celui qui pourra m'aider