Saya telah mengerjakan sebuah proyek dalam beberapa hari terakhir. Ternyata dibuat dengan animasi CSS3. Karena tidak sesuai dengan IE, itu telah diubah menjadi menggunakan JS. Saya akan membaginya dengan Anda untuk referensi Anda. Jika ada bug dalam kode, mohon maafkan saya karena tidak menulis dengan baik!
<! Doctype html public "-// w3c // dtd xhtml 1.0 transisi // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"><html xmlns = "http://www.w3.org/1999/xhtml" xml: lang = "en"> <head> <meta http-equiv = "content-type" content = "Text/html; charset = utf-8"/<title> float> Top </title> type = "text/css">. W1000 {position: relatif; lebar: 1000px; margin: 0 auto;}. PositionPub {position: absolute;}. PositionPub p {width: 50px; tinggi: 50px; latar belakang:#333; warna: #ffff; line-height: 50px; text-align: center; posisi: absolute;}. ad_float {t op: 50px; kiri: 50px;}. ad_float1 {top: 150px; kiri: 250px;}. ad_float2 {top: 250px; kiri: 450px;} </tyle> </head> <dig> <div> <piv> <p id = "ad_float"> Kiri </p> </div> <div> <p id = "ad_float1"> kanan </p> </div> <div> <p id = "ad_float2"> down </p> </div> </div> <script = "text/javaScript"> var x = 0, y = 1, = 0 script = "text/javaScript"> var x = 0, y = x1 = 2; 2; var delay = 10; var obj = document.geteLementById ("ad_float"); var obj1 = document.geteLementById ("ad_float1"); var obj2 = document.geteLementById ("ad_float2"); fungsi ad_float () {var l = 0; var r = 100; Obj.sty. "px";x = x + step * (xin ? 1 : -1);if (x < L) {xin = true;x = L;}if (x > R) {xin = false;x = R;}};function ad_Float1() {var L1 = 0;var R1 = 100;obj1.style.left = x1 + document.documentElement.scrollLeft + "px"; x1 = x1 + langkah * (xin? 1: -1); if (x1 <l1) {xin = true; x1 = l1;} if (x1> r1) {xin = false; x1 = r1;}}; fungsi ad_float2 () {var t = 0; var b = 150; + "px";y = y + step2 * (yin ? 1 : -1);if (y < T) {yin = true;y = T;}if (y > B) {yin = false;y = B;}};var itl = setInterval("ad_Float()", delay);var itl1 = setInterval("ad_Float1()", delay);var itl2 = setInterval ("ad_float2 ()", tunda); </script> </body> </html>Kode berakhir di sini, saya harap ini akan membantu semua orang!