Bonjour Darkodeur,
voici un exemple de diaporama (slider) semi-automatique et/ou automatique :
http://sentrais.eu/diaporama_v-8/diaporama-8.htm
dont le mécanisme est du
javascript qui procède à un double jeu de basculements de
class css3 d'un couple évolutif d'éléments. D'où son titre :
un diaporama dynamique
Question sur le référencement d'images qu'il faut évidemment considérer, que soulève judicieusement Greg_Lumiere dans ses
posts. Meilleur que des noms d'images
i1.png i2.png i3.png, on pourrait toutefois se satisfaire de ceci :
theme-1.png theme-2.png theme-3.png ... quitte à élaborer un second voire un troisième diaporama qui renseigneraient d'autres thèmes utiles au référencement par le renom des images. Ainsi le
.html proposera
theme comme thème particulier qui soit apte au référencement :
<p id="diaporama">
<img id="image_clone" name="image_clone" class="clo_0" src="dia/theme-1.png" />
<img id="image_generique" name="image_generique" class="clo_0" src="dia/theme-1.png" />
</p>
Tu verras par la découverte du code-source de la page que le fichier
diaporama.js est simple à décortiquer, et qu'il propose des
comments qui te seront utiles pour la compréhension de la stratégie globale et de ses méthodes
javascript. Rien cependant ne t'invitera à penser que cette solution serait unique !
Note rédhibitoire : que savons-nous aujourd'hui des moteurs de recherche qui puissent extraire de fichiers
.css et
.js des données exploitables au référencement ? Sinon google, or un-tout-petit-peu ... hors d'un
.js. Mais aujourd'hui, de tous les moteurs : aucun d'un
.css, malheureusement.
Une autre prouesse serait de rédiger un
slider en pur
css3. Mais je doute au-delà d'un impossible référencement, de sa souplesse d'aménagement au gré d'
events produits par un visiteur, car je trouve le
css3 encore un-peu-beaucoup schizophrène face à
jQuery dont au plus
javascript.
@Greg_Lumiere :
css et
javascript ne peuvent se limiter à de la joliesse : 95% du web est un visuel pour la transmission d'informations (les 5% restants = ? = music en surface + meta-data en sous-terrain), et ce visuel implique le fait de procurer une "trace" intelligible, c'est-à-dire, ici proprement graphique. Mais un
esthétisme français peut souffrir parfois de réelles pathologies, qui porterait à réduire les fonctions essentielles du phénomène du très grand langage visuel : j'en redoute volontiers, auprès de toi une virulence certaine ! Ceci dit : tu as parfaitement deviné la limite de tout référencement de
slider par
.css lorsqu'on envisage des raccourcis fabuleux.
@Olivier C :
le
preload des images en ton exemple est à devoir considérer. Ce que j'ai d'emblée considéré dans mon exemple :
http://sentrais.eu/diaporama_v-8/preload.js
et qui devra interpeler Darkodeur pour son projet de
slider. Ou lui imposer une multiplication d'écriture ?
Modifié par pictural (06 Dec 2016 - 15:29)