Jquery中文網 www.4271936.live
Jquery中文網 >  jQuery  >  jquery 教程  >  正文 jquery實現鼠標拖動圖片效果示例代碼

jquery實現鼠標拖動圖片效果示例代碼

發布時間:2014-06-14   編輯:www.4271936.live
鼠標拖動圖片的效果想必大家都有見到過吧,其實實現起來很簡單的,下面使用query來實現下,感興趣的朋友不要錯過
復制代碼 代碼如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title><script type="text/javascript" src="jquery-1.4.4.js"></script>
<script type="text/javascript">
$(function(){
$("html").mousemove(function(e){
$("#a").css("left",e.pageX).css("top",e.pageY);
});
});
</script>
<style type="text/css">
.a {
width:200px;
height:100px;
position:absolute;
background-color:rgb(0,0,0);
}
</style>
</head>
<body>

<img src="圖片" id="a" name="a" class="a" >

只做了一個簡單的實例
</body>

</html>

您可能感興趣的文章:
jquery實現鼠標拖動圖片效果示例代碼
用jquery等比例控制圖片寬高的具體實現
Jquery uploadify圖片上傳插件無法上傳的解決方法
jQuery拖動圖片刪除示例
JQuery 圖片滾動輪播示例代碼
jquery預覽圖片實現鼠標放上去顯示實際大小
JQuery實現鼠標移動到圖片上顯示邊框效果
jquery實現簡單易懂的圖片展示小例子
jquery上傳插件fineuploader上傳文件使用方法(jquery圖片上傳插件)
jQuery實現圖片放大預覽實現原理及代碼

關鍵詞: jquery  鼠標拖動   
[關閉]
微信下载APP完成任务如何赚钱 默认版块两码 新希望股票股吧 陕西11选5号码预测当天 黑龙江p62中奖规则及金额图 浙冮体彩6十1开奖结果 梦幻国际app官网 北京pk10牛牛算法 手机捕鱼游戏 股票短线qq群 pk10开奖官网