實現jQuery鼠標滑向當前圖片高亮顯示并且其它圖片變灰的方法
本文實例講述了jQuery實現鼠標滑向當前圖片高亮顯示并且其它圖片變灰的方法。分享給大家供大家參考。具體如下：
鼠標滑向當前圖片高亮顯示，其它圖片變灰 這個 網頁特效一些商城經常用到比如淘寶，當用戶鼠標移到某一個圖片時候變亮 周圍圖片變灰，形成對比增加用戶體驗
這個jquery特效的原理是：鼠標滑過當前元素，找到他的同輩元素i,并為它加上opacity_bg類，鼠標移出當前元素，到他的同輩元素i,并移除它加上opacity_bg類景
核心js代碼如下：
$(document).ready(function(){ $("ul li").hover(function(){ $(this).siblings().find("i").addClass("opacity_bg"); //鼠標滑過當前元素，找到他的同輩元素i,并為它加上opacity_bg類 },function(){ $(this).siblings().find("i").removeClass("opacity_bg"); //鼠標移出當前元素，到他的同輩元素i,并移除它加上opacity_bg類景 })})
運行效果如下圖所示：
代碼如下:
jquery聚光燈效果----無效果請刷新
鼠標滑向當前圖片高亮顯示，其它圖片變灰
希望本文所述對大家的jquery程序設計有所幫助。
【實現jQuery鼠標滑向當前圖片高亮顯示并且其它圖片變灰的方法】相關文章：
關于jQuery實現高亮顯示的方法介紹08-20
常用的手機產品展示圖片修方法07-15
實現鼠標畫圖的Java程序06-22
圖片的使用技巧07-12
Win7系統批量圖片重命名方法01-04
J2ME插值算法如何實現圖片的放大縮小10-27
CAD如何插入圖片05-03
網站圖片優化的技巧08-22
冬至qq祝福圖片06-17