标签:位移 wrap OLE abs img margin pre color rip
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>随滚动条滚动广告图片</title> <style> body{margin: 0;} .wrap{ height: 3000px; background: #ccc; } .ad{ position: absolute; z-index: 1000; left:50px; top:100px; } </style> </head> <body> <div class="wrap"> <div class="ad"> <img src="winter.jpg" width="300" height="280"> </div> </div> <script src="jquery-1.12.4.js"></script> <script> $(function () { //offset获取当前元素的位移 let x = $(".ad").offset().left; let y = $(".ad").offset().top; //console.log("x=" + x + ",y=" + y); $(document).scroll(function () { //获取滚动条当前滚动产生的x y位移量 let sTop = $(document).scrollTop(); let sLeft = $(document).scrollLeft(); //前滚动产生的x y位移量 与原图片的位置 相加 $(".ad").offset({ top: y + sTop, left: x+sLeft }); }); }); </script> </body> </html>
标签:位移 wrap OLE abs img margin pre color rip
原文地址:https://www.cnblogs.com/taoist123/p/11172202.html