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="https://www.jb51.net/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="https://www.jb51.net/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="https://www.jb51.net/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实现的鼠标滚轮控制图片缩放功能,结合完整实例形式分析了jQuery基于鼠标滚轮mousewheel事件进行页面元素属性动态操作的相关实现技巧,需要的朋友可以参考下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 实现下拉联动效果功能实现
这篇文章主要介绍了基于 jquery-cxselect 实现下拉联动效果,下拉联动是基于query的一款联动下拉菜单插件 jquery-cxselect实现，本文通过实例代码给大家介绍的非常详细，需要的朋友可以参考下2023-02-02
jquery text()要注意啦 ，大家可以看看。2009-10-10
基于jQuery的360图片展示实现代码，需要的朋友可以参考下2012-06-06
在之前做项目的时候经常会在主页面上点击某个按钮，右侧弹出一个div输出对应内容的详细信息，怎么实现的呢，今天小编给大家分享通过jquery实现点击任意位置弹出层外关闭弹出层效果，感兴趣的朋友一起看看吧2016-10-10
这篇文章主要介绍了jQuery+AJAX实现网页无刷新上传的相关资料，十分详细,需要的朋友可以参考下2015-02-02
最新评论