jquery預覽圖片實作滑鼠放上去顯示實際大小_jquery

複製代碼如下代碼：

渡//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


>
;
>


img
{
邊框：無;
}


ul，li
{
邊距：0；
填充：0;
}


li
{
列表樣式：無；
浮動：左；
顯示：內聯；
右邊距：10px;
}


#imglist img
{
寬度：150px;
高度：120px;
}
}

#imgshow
{
位置：絕對;
邊框：1px 實線#ccc;
背景：#333;
內邊距：5px;
顏色：#333;
內邊距：5px;
顏色：# fff;
顯示：無；
}
風格>

var ShowImage = function () {
xOffset = 10;
yOffset = 30;
$("#imglist").find("img").hover(function (e) {
$("//下面是兩種樣式賦值方法
//$("#imgshow").css("top", (e .pageY - xOffset) " px").css("left", (e.pageX yOffset) "px").fadeIn("slow");
$("#imgshow").css({"top ":(e.pageY - xOffset) "px","left":(e.pageX yOffset) "px"}).fadeIn("slow");
}, function () {
$( "#imgshow").刪除（）；
}）；
};


jQuery(document).ready(function () {
ShowImage();
});
腳本>


頭>

• 
  

ul>

身體>