Cet article décrit la méthode de mise en œuvre de l'effet de rouleau chronométré de l'image JS. Partagez-le pour votre référence, comme suit:
<! Doctype html public "- // w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns = "http://www.w3.org/1999/xhtml"> <éad> <meta http-equiv = "contenu-type" contenu = "text / html; charset = utf-8" /> <meta http-equiv = "x-ua-compatible" content = "ie = 7" / Title> Roll Effect </Title> <style type = "text / css"> .father {position: relatif; débordement: caché; hauteur: 100px; Largeur: 300px; } .box {float: Left; taille de police: 12px; Largeur: 80px; hauteur: 120px; débordement: caché; Position: absolue; } </ style> <script linguisse = "javascript" type = "text / javascript"> var t; window.onload = function () {var o = document.getElementById ('box'); t = window.setinterval (function () {scrollup (o, 24, 0);}, 3000)} /// Méthode principale de défilement /// paramètres: o Bloque de défilement objet /// Paramètres: d hauteur de chaque défilement /// paramètres: c getFirstChild (O.FirstChild) .clonenode (true); O.Removechild (getFirstChild (O.FirstChild)); O.APPEndChild (T); t.style.margintop = "0px"; } else {c + = 1; getFirstChild (O.FirstChild) .style.Margintop = -C + "PX"; window.setTimeout (function () {scrollup (o, d, c)}, 15); }} // Résoudre le problème que les espaces sont renvoyés sous forme de nœuds dans la fonction firefox getFirstChild (node) {while (node.nodeType! = 1) {node = node.nextsibling; } Node de retour; } </ script> </ head> <body> Décroquette de la démonstration de l'effet de synchronisation <hr> <div> <div id = "box"> <div> <img src = "../ img / head / 1.png" /> </ div> <v> <img src = "../ img / head / 2.png" /> </v> <v> <img src = "../ IMg / headg / 3.png" />> <div> <img src = "../ IMG / headp / 3.png" />> <div> <img src = "../ IMG / 3.PNG" />> <Div> <Img Src = ". </div> <v> <img src = "../ img / head / 4.png" /> </div> </div> </div> </ body> </html>Pour plus d'informations sur le contenu lié à JavaScript, veuillez consulter les sujets de ce site: "Résumé des effets et techniques de commutation JavaScript", "Résumé des effets et techniques de recherche JavaScript", "Résumé des erreurs Javascript et des techniques de débogage" Algorithmes et techniques de traversée JavaScript ", et" Résumé de l'utilisation des opérations mathématiques JavaScript "
J'espère que cet article sera utile à la programmation JavaScript de tous.