jQuery浮窗图片到页面中间的代码

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="position:absolute;left:50px;top:60px;">
    <div id="a" style="width:40px;height:40px;position:absolute;left:460px;background:salmon;text-align: center;"><font size="+3">×</font></div>
    
    <div style="width:700px;height:500px;"><img style="width:700px;height:500px;" src="./1.png"></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>

猜你喜欢

转载自www.cnblogs.com/baker95935/p/11131254.html