jquery實現鼠標滑過小圖時顯示大圖的方法_jquery
來源:懂視網
責編:小采
時間:2020-11-27 21:32:01
jquery實現鼠標滑過小圖時顯示大圖的方法_jquery
jquery實現鼠標滑過小圖時顯示大圖的方法_jquery:本文實例講述了jquery實現鼠標滑過小圖時顯示大圖的方法。分享給大家供大家參考。具體實現方法如下: 代碼如下: li{list-style:none;float:left;margin-left:10px;} var data = { images/11_s.jpg:[images/1
導讀jquery實現鼠標滑過小圖時顯示大圖的方法_jquery:本文實例講述了jquery實現鼠標滑過小圖時顯示大圖的方法。分享給大家供大家參考。具體實現方法如下: 代碼如下: li{list-style:none;float:left;margin-left:10px;} var data = { images/11_s.jpg:[images/1
本文實例講述了jquery實現鼠標滑過小圖時顯示大圖的方法。分享給大家供大家參考。具體實現方法如下:
代碼如下:
$("div").first().append(smallPath);
//小圖上添加事件
smallPath.mouseover(function(){
//最后一個div淡入效果
$("div").last().fadeIn("fast");
//獲取大圖地址
$("#show").attr("src",$(this).attr("bigMapPath"));
//獲取大圖名稱并設置樣式
$("#imgTitle").text($(this).attr("bigMapName")).css({"background":"#ebf1de","padding":"10px","margin-bottom":"10px"});
});
smallPath.mouseout(function(){
$("div").last().fadeOut("fast");
});
});
});
script>
希望本文所述對大家的jQuery程序設計有所幫助。
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
jquery實現鼠標滑過小圖時顯示大圖的方法_jquery
jquery實現鼠標滑過小圖時顯示大圖的方法_jquery:本文實例講述了jquery實現鼠標滑過小圖時顯示大圖的方法。分享給大家供大家參考。具體實現方法如下: 代碼如下: li{list-style:none;float:left;margin-left:10px;} var data = { images/11_s.jpg:[images/1