jQuery浮窗图片到页面中间的代码兼容移动端
<!doctype html> <html> <head> <meta charset="utf-8"> <title>jquery漂浮广告代码-jq22.com</title> <script src="https://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script> <style> </style> </head> <body> <div id="imgDiv" style="80%;margin:0px auto;z-index:9999"> <div id="a" style="40px;height:40px;position:absolute;left:460px;background:salmon;text-align: center;"><font size="+3">×</font></div> <div style="80%;margin:0px auto;"><img style="90%; height:auto" src="1.jpg"></div> </div> <script> var xin = true, yin = true; var step = 1; var delay = 10; var $obj; $(function() { $obj = $("#imgDiv"); var time = window.setInterval("move(imgDiv)", delay); $obj.mouseover(function() { clearInterval(time) }); $obj.mouseout(function() { time = window.setInterval("move(imgDiv)", delay) }); }); function move(divName){ var top = ($(window).height() - $(divName).height())/2; var left = ($(window).width() - $(divName).width())/2; var scrollTop = $(document).scrollTop(); var scrollLeft = $(document).scrollLeft(); $(divName).css( { position : 'absolute', 'top' : top + scrollTop, left : left + scrollLeft } ).show(); } $(function() { $("#a").click(function() { var b = $("#a").parent(); $(b).remove(); }) }) $("#imgDiv").draggable(); </script> </body> </html>