jquery-鼠标滑过图片渐变效果
时间:2010-09-09 来源:fxh_空格
代码
<body style="background:#000;">
<img src="http://www.cssrain.cn/skins/tim/logo-jq.gif" /> <br/><br/>
<img src="http://www.cssrain.cn/demo/JQuery+API/logo-json.gif" /> <br/><br/>
<img src="http://www.baidu.com/img/logo.gif" /> <br/><br/>
<img src="http://www.google.cn/intl/zh-CN/images/logo_cn.gif" /> <br/>
<script>
$('img').each(function(){$(this).css("opacity",".6")});
$('img').mouseover(function()
{
$(this).animate({
opacity:"1"
})
}).mouseout(function()
{
$(this).animate({
opacity:".6"
})
});
</script>
</body>
<img src="http://www.cssrain.cn/skins/tim/logo-jq.gif" /> <br/><br/>
<img src="http://www.cssrain.cn/demo/JQuery+API/logo-json.gif" /> <br/><br/>
<img src="http://www.baidu.com/img/logo.gif" /> <br/><br/>
<img src="http://www.google.cn/intl/zh-CN/images/logo_cn.gif" /> <br/>
<script>
$('img').each(function(){$(this).css("opacity",".6")});
$('img').mouseover(function()
{
$(this).animate({
opacity:"1"
})
}).mouseout(function()
{
$(this).animate({
opacity:".6"
})
});
</script>
</body>
相关阅读 更多 +