JQuery切換顯示的效果實例代碼
更新時間：2013年02月27日 11:56:50 作者：
本文講解了JQuery切換顯示的效果實例代碼，需要的朋友可以參考一下
JQuery真的太強大了，真好看！
Jquery代碼如下：
復制代碼 代碼如下:
$(function () {
$(".n_zyb_gzright .n_zyb_gzrightlist").hover(function () {
$(this).find(".n_zyb_gzrightlistc").attr("style", "display:block").parent().siblings().find(".n_zyb_gzrightlistc").attr("style", "display:none");
})
})
Html代碼如下：
復制代碼 代碼如下:
<div class="n_zyb_gzright">
<div class="n_zyb_gzrightlist">
<a target="_blank" class="a1" href="/Media/PlayMedia/212.shtml" title="我們都能幸福著">
我們都能幸福著</a> <a class="" href="javascript:void(0)">人氣：<font>1</font></a>
<div class="clear">
</div>
<div style="display:block" class="n_zyb_gzrightlistc">
<div class="index_zx_img_left">
<a target="_blank" href="/User/ShowInfo/220">
<img src="http://www.dbjr.com.cn/Avatar/2012113010521695319512.gif"></a></div>
<div class="n_zpcen_ti">
<a target="_blank" href="/User/ShowInfo/220">jstu001</a><br>
<a target="_blank" class="n_zpa" href="/User/ShowInfo/220">
作品：<span>18</span></a> </div>
<div class="clear">
</div>
</div>
</div>
<div class="n_zyb_gzrightlist">
<a target="_blank" class="a1" href="/Media/PlayMedia/232.shtml" title="開心就好了。">
開心就好了。</a> <a class="" href="javascript:void(0)">人氣：<font>1</font></a>
<div class="clear">
</div>
<div style="display:none" class="n_zyb_gzrightlistc">
<div class="index_zx_img_left">
<a target="_blank" href="/User/ShowInfo/221">
<img src="http://www.dbjr.com.cn/Avatar/2013011410552810013828.jpg"></a></div>
<div class="n_zpcen_ti">
<a target="_blank" href="/User/ShowInfo/221">jteacher001</a><br>
<a target="_blank" class="n_zpa" href="/User/ShowInfo/221">
作品：<span>12</span></a> </div>
<div class="clear">
</div>
</div>
</div>
<div class="n_zyb_gzrightlist">
<a target="_blank" class="a1" href="/Media/PlayMedia/213.shtml" title="2131321">
</a> <a class="" href="javascript:void(0)">人氣：<font>0</font></a>
<div class="clear">
</div>
<div style="display:none" class="n_zyb_gzrightlistc">
<div class="index_zx_img_left">
<a target="_blank" href="/User/ShowInfo/220">
<img src="http://www.dbjr.com.cn/Avatar/2012113010521695319512.gif"></a></div>
<div class="n_zpcen_ti">
<a target="_blank" href="/User/ShowInfo/220">jstu001</a><br>
<a target="_blank" class="n_zpa" href="/User/ShowInfo/220">
作品：<span>18</span></a> </div>
<div class="clear">
</div>
</div>
</div>
</div>
您可能感興趣的文章:
- jquery淡化版banner異步圖片文字效果切換圖片特效
- jQuery簡單實現(xiàn)banner圖片切換
- javascript 上下banner替換具體實現(xiàn)
- jquery左右滾動焦點圖banner圖片鼠標經過顯示上下頁按鈕
- 比較漂亮的幾款迎國慶Banner圖片打包下載
- 十個新年banner，祝大家新年快樂！
- Banner程序
- 利用PHP實現(xiàn)與ASP Banner組件相似的類
- 非常酷的角BANNER
- JS+DIV實現(xiàn)鼠標劃過切換層效果的實例代碼
- JS實現(xiàn)切換標簽頁效果實例代碼
- js圖片自動切換效果處理代碼
- 最簡單的js圖片切換效果實現(xiàn)代碼
- 網站基于flash實現(xiàn)的Banner圖切換效果代碼
相關文章
這篇文章主要介紹了jQuery實現(xiàn)的鼠標滾輪控制圖片縮放功能,結合完整實例形式分析了jQuery基于鼠標滾輪mousewheel事件進行頁面元素屬性動態(tài)操作的相關實現(xiàn)技巧,需要的朋友可以參考下2017-10-10
這篇文章主要介紹了JQuery中queue方法用法,結合實例形式分析了queue方法操作函數隊列相關技巧與注意事項,需要的朋友可以參考下2019-01-01
很簡單有趣的效果，邏輯很清楚，代碼也簡單，是練手的好東東。2010-04-04
解決qrcode.js生成二維碼時必須定義一個空div的問題
這篇文章主要介紹了解決qrcode.js生成二維碼時必須定義一個空div的問題，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-07-07
常用的方法就是把控件的CSS position屬性設置為relative或 absolute，大家也可以學習下本文提供的其他方法2013-09-09
基于?jquery-cxselect?實現(xiàn)下拉聯(lián)動效果功能實現(xiàn)
這篇文章主要介紹了基于?jquery-cxselect?實現(xiàn)下拉聯(lián)動效果,下拉聯(lián)動是基于query的一款聯(lián)動下拉菜單插件 jquery-cxselect實現(xiàn)，本文通過實例代碼給大家介紹的非常詳細，需要的朋友可以參考下2023-02-02
jquery text()要注意啦 ，大家可以看看。2009-10-10
基于jQuery的360圖片展示實現(xiàn)代碼，需要的朋友可以參考下2012-06-06
jQuery實現(xiàn)點擊任意位置彈出層外關閉彈出層效果
在之前做項目的時候經常會在主頁面上點擊某個按鈕，右側彈出一個div輸出對應內容的詳細信息，怎么實現(xiàn)的呢，今天小編給大家分享通過jquery實現(xiàn)點擊任意位置彈出層外關閉彈出層效果，感興趣的朋友一起看看吧2016-10-10
這篇文章主要介紹了jQuery+AJAX實現(xiàn)網頁無刷新上傳的相關資料，十分詳細,需要的朋友可以參考下2015-02-02