欢迎访问web记录!每一步的成长都是一种幸福,聪明的女孩擅长记录幸福!
您现在的位置:web记录 > 前端开发 > Jquery >

fadeIn() 方法实现两张图片的隐藏显示切换

更新时间:2013-11-04 浏览次数:
<script src="http://www.webjilu.com/img/jquery-1.9.1.min.js" type="text/javascript"></script>
<script language="javascript">
var qb_id=0;
function qb_lh(id)
{
if(qb_id==0)
{
$("#"+id+1).fadeIn();
document.getElementById(id+0).style.display="none";
qb_id=1;
}
else
{
$("#"+id+0).fadeIn();
document.getElementById(id+1).style.display="none";
qb_id=0;
}
}
</script>

注:fadeIn() 方法使用淡入效果来显示被选元素,假如该元素是隐藏的。

<body>

<div id="qb0"> <img src="page_edit.png" width="128" height="128" /> </div>
<div id="qb1" style="display:none"> <img src="page_add.png" width="128" height="128" /> </div>
<div style="width:128px; text-align:center"><a href="javascript:void"><img src="left.gif" onclick="qb_lh('qb')" /></a><a href="javascript:void"><img src="right.gif" onclick="qb_lh('qb')" /></a></div>
</body>

效果演示:http://www.webjilu.com/xz/jq/1/index.html
关键词:

    + 相关信息

    前端案例

    返回顶部 欢迎访问web记录!每一步的成长都是一种幸福,聪明的女孩擅长记录幸福!