لقد عملت في مشروع في الأيام القليلة الماضية. اتضح أنه تم عرضه مع الرسوم المتحركة CSS3. لأنه غير متوافق مع IE ، تم تغييره إلى استخدام JS. سوف أشاركها معك للرجوع إليها. إذا كان هناك أي أخطاء في الكود ، فيرجى سامحني لعدم الكتابة جيدًا!
<! doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3 xmlns = "http://www.w3.org/1999/xhtml" xml: lang = "en" type = "text/css">. W1000 {الموضع: النسبية ؛ العرض: 1000px ؛ الهامش: 0 auto ؛}. positionpub {الموضع: absolute ؛}. positpub P {Width: 50px ؛ الارتفاع: 50px ؛ الخلفية:#333 ؛ اللون: #ffff ؛ خط الذروة: 50px ؛ text-align: center ؛ الموضع: absolute ؛}. ad_float {t OP: 50px ؛ اليسار: 50px ؛}. ad_float1 {top: 150px ؛ اليسار: 250px ؛}. ad_float2 {top: 250px ؛ اليسار: 450px ؛} </styp id = "ad_float"> اليسار </p> </viv> <viv> <p id = "ad_float1"> اليمين </p> </viv> <viv> <p id = "ad_float2"> لأسفل </p> </p> </div> <script type = "text/javascript"> var x = 0 ، 1 ، Step2 = 2 ؛ var delay = 10 ؛ var obj = document.getElementById ("ad_float") ؛ var obj1 = document.getElementById ("ad_float1") ؛ var obj2 = document.getElementById ("ad_float2") ؛ function ad_float () {var l = 0 ؛ document.documentElement.scrollleft + "px" ؛ x = x + step * (xin؟ 1: -1) ؛ if (x <l) {xin = true ؛ x = l ؛} if (x> r) {xin = false ؛ x = r ؛ document.documentElement.scrollleft + "px" ؛ x1 = x1 + step * (xin؟ 1: -1) ؛ if (x1 <l1) {xin = true ؛ x1 = l1 ؛} if (x1> r1) {xin = false ؛ x1 = r1 ؛} ؛ y + document.documentElement.scrolltop + "px" ؛ y = y + step2 * (yin؟ 1: -1) ؛ if (y <t) {yin = true ؛ y = t ؛} if (y> b) {yin = false ؛ y = b ؛ setInterval ("ad_float1 ()" ، تأخير) ؛ var itl2 = setInterval ("ad_float2 ()" ، تأخير) ؛ </script> </body> </html>ينتهي الرمز هنا ، وآمل أن يكون مفيدًا للجميع!