Maison  >  Article  >  interface Web  >  Le code jQuery implémente la chronologie de l'historique de développement effets spéciaux_jquery

Le code jQuery implémente la chronologie de l'historique de développement effets spéciaux_jquery

WBOY
WBOYoriginal
2016-05-16 15:48:101464parcourir

Partagez un code d'effets spéciaux de chronologie basé sur l'historique de développement de jQuery, avec des flèches gauche et droite et un onglet de chronologie numérique commutant le téléchargement d'effets spéciaux. Les rendus et le code d'implémentation sont présentés ci-dessous :

Code HTML :

<div id="timeline">
  <ul id="issues">
   <li id="1900">
    <img src="images/img4.jpg" width="436" height="300" />
   </li>
   <li id="1944">
    <img src="images/img4.jpg" width="436" height="300" />
   </li>
   <li id="1950">
    <img src="images/img4.jpg" width="436" height="300" />
   </li>
   <li id="1971">
    <img src="images/img4.jpg" width="436" height="300" />
   </li>
   <li id="1999">
    <img src="images/img4.jpg" width="436" height="300" />
   </li>
   <li id="2001">
    <img src="images/img4.jpg" width="436" height="300" />
   </li>
   <li id="2011">
    <img src="images/img4.jpg" width="436" height="300" />
   </li>
  </ul>
  <ul id="dates">
   <li><a href="#1900">1900</a></li>
   <li><a href="#1944">1944</a></li>
   <li><a href="#1950">1950</a></li>
   <li><a href="#1971">1971</a></li>
   <li><a href="#1999">1999</a></li>
   <li><a href="#2001">2001</a></li>
   <li><a href="#2011">2011</a></li>
  </ul>
  <a href="#" id="next">></a>
  <a href="#" id="prev"><</a>
 </div>

Le contenu du code ci-dessus est l'intégralité du contenu de la chronologie du processus de développement utilisant le code jQuery. J'espère qu'il sera utile à tout le monde.

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn