jQuery fadeTo方法调整图片的透明度使用介绍

 更新时间:2013年05月06日 17:49:46   作者:  
利用jquery的fadeTo方法可以简单的制作一些很不错的动画效果.可以使图片或者文字或者区块以不同的透明度效果出现.例如以下练习实例,感兴趣的朋友可以参考下哈
复制代码 代码如下:

<head>
<title></title>
<style type="text/css">
.imgclass{ width:300px; height:300px; border:solid 1px red;}
</style>
<script src="jquery-1.9.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$('#Select1').change(function () {
var thevalue = $(this).val();
$('img').fadeTo(2000, thevalue);
})
})
</script>
</head>
<body>
<table>
<tr>
<td>
透明度:
<select id="Select1">
<option value="0">0</option>
<option value="0.2">0.2</option>
<option value="0.4">0.4</option>
<option value="0.6">0.6</option>
<option value="0.8">0.8</option>
<option value="1">1</option>
</select>
</td>
<td>
<img src="images/泪奔1.gif" class="imgclass" />
</td>
</tr>
</table>
</body>

相关文章

  • jQuery.each()用法分享

    jQuery.each()用法分享

    昨天写了个小插件,用到这个方法,不太明白$.each()这个方法,今天查了下手册,学习一下
    2012-07-07
  • Jquery实战_读书笔记1—选择jQuery

    Jquery实战_读书笔记1—选择jQuery

    近期公司积极组织我们这些开发人员学习进步,督促我们学习更多的技术来提高自己。为此我选择了jQuery作为我学习的方向,同时我也是想将我的学习心得分享给大家,以后我会不断的更新一系列jQuery方面的学习纪要,帮助大家学习。
    2010-01-01
  • jQuery关于导航条背景切换效果实现示例

    jQuery关于导航条背景切换效果实现示例

    导航条背景切换的效果,想必大家在浏览网页时可能会碰到过,下面为大家介绍下使用jquery如何实现,具体思路及代码如下,感兴趣的朋友可以参考下
    2013-09-09
  • Jquery中使用show()与hide()方法动画显示和隐藏图片

    Jquery中使用show()与hide()方法动画显示和隐藏图片

    以前我们在js中如果要隐藏显示一个元素我们需要利用display等于none来设置并且还没有效果,现在在jquery中有了hide();我们可以利用hide()方法来操作,希望本文章给大家所有帮助。
    2015-10-10
  • jQuery常用数据处理方法小结

    jQuery常用数据处理方法小结

    这篇文章主要介绍了jQuery常用数据处理方法,实例总结了trim、param、isArray、isFunction、each等jQuery常用的数据处理方法,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-02-02
  • JQuery 进入页面默认给已赋值的复选框打钩

    JQuery 进入页面默认给已赋值的复选框打钩

    这篇文章主要介绍了JQuery 进入页面默认给已赋值的复选框打钩的实现代码,非常不错,具有参考借鉴价值,需要的朋友参考下吧
    2017-03-03
  • 仿新浪微博返回顶部的jquery实现代码

    仿新浪微博返回顶部的jquery实现代码

    在web页面中,如果页面较高,为了方便用户快速地返回顶部,都会添加一个返回顶部按钮
    2012-10-10
  • jQuery根据表单name获取值的方法

    jQuery根据表单name获取值的方法

    这篇文章主要介绍了jQuery根据表单name获取值的方法,总结分析了jQuery获取表单值的常用技巧,涉及jQuery选择器的使用技巧,非常简单实用,需要的朋友可以参考下
    2016-05-05
  • jQuery中对节点进行操作的相关介绍

    jQuery中对节点进行操作的相关介绍

    本篇文章小编将为大家介绍,在jQuery中对节点进行操作的解决办法,有需要的朋友可以参考一下
    2013-04-04
  • jQuery实现简单飞机大战

    jQuery实现简单飞机大战

    这篇文章主要为大家详细介绍了jQuery实现简单飞机大战,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-07-07

最新评论