jQuery實現(xiàn)拖動效果的實例代碼,具體代碼如下所示:
<!DOCTYPE html> <html><head><style> div{ width:100px; height:100px; background:red; position:absolute;} </style> <script type="text/javascript" src="js/jquery-1.11.3.js"></script> <script> $(function(){var disX = 0;var disY = 0;$('div').mousedown(function(ev){disX = ev.pageX - $(this).offset().left;//獲取鼠標到元素的left,top位置disY = ev.pageY - $(this).offset().top;$(document).mousemove(function(ev){$('div').css('left',ev.pageX - disX);//獲取移動后鼠標的位置,并重新賦值給元素$('div').css('top',ev.pageY - disY);});$(document).mouseup(function(){$(document).off();});return false;}); }); </script> </head> <body> <div></div> </body> </html> 以上所述是小編給大家介紹的jQuery實現(xiàn)拖動效果的實例代碼,希望對大家有所幫助,如果大家有任何疑問歡迎給我留言,小編會及時回復(fù)大家的!
新聞熱點
疑難解答