jQuery 移动 DIV 代码

来源:互联网 发布:linux的dd命令备份 编辑:程序博客网 时间:2024/05/05 12:08

jQuery 写的 移动DIV,适合网页广告


主要代码如下:

$('#showdiv').hide();

var mytop;

var mytop;

var ca_ = 0;

$('.moveBar').css({

'left': ($(window).width() - $('.moveBar').width())/2,

'top': ($(window).height() - $('.moveBar').height())/2

});

ca_ = $('div.moveBar').offset().top;

$('.moveBar').mousedown(

function (event) {

var scrolltop = $(document).scrollTop();

var isMove = true;

var abs_x = event.pageX - $('div.moveBar').offset().left;

var abs_y = event.pageY - $('div.moveBar').offset().top;

$(document).mousemove(function (event) {

if(isMove) {

var obj = $('div.moveBar');

var sz = $(window).height();

obj.css({

'left': event.pageX - abs_x,

'top': event.pageY - abs_y

});

$("#so").html(scrolltop);

$("#divi").html($('div.moveBar').offset().top);

ca_=$('div.moveBar').offset().top - scrolltop;

$("#ca_").html(ca_);

}

}).mouseup(

function () {

isMove = false;

}

);

}

).mouseover(function(filename){  

                    //$("input.btn").hide();  

                    $(this).css("cursor","move");  

                });  

         mytop =$('div.moveBar').offset().top;

            $(window.document).scroll(function () {

                var scrolltop = $(document).scrollTop();

                var top=ca_+scrolltop;

                $('div.moveBar').offset({ top: top });

$("#so").html(scrolltop);

$("#divi").html($('div.moveBar').offset().top);

$("#ca_").html(ca_);

            });

演示下载源码

0 0