温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
  • 忘记密码?
登录注册×
获取短信验证码
其他方式登录
点击 登录注册 即表示同意 《亿速云用户服务条款》
  • 服务器
  • 数据库
  • 开发技术
  • 网络安全
  • 互联网科技
登 录 注册有礼
最新更新 网站标签 地图导航
产品
  • 首页 > 
  • 教程 > 
  • 开发技术 > 
  • web开发 > 
  • jquery如何让图片逐渐消失

jquery如何让图片逐渐消失

发布时间:2022-04-22 09:58:09 来源:亿速云 阅读:201 作者:iii 栏目: web开发

这篇文章主要介绍“jquery如何让图片逐渐消失”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“jquery如何让图片逐渐消失”文章能帮助大家解决问题。

逐渐消失的方法:1、用fadeOut(),只需设置从可见到消失的毫秒数即可,语法“$("img").fadeOut(毫秒数)”;2、用fadeTo()设置在指定毫秒数中透明度降为0即可,语法“$("img").fadeTo(毫秒数,0)”。

jquery如何让图片逐渐消失

本教程操作环境:windows7系统、jquery1.10.2版本、Dell G3电脑。

jquery让图片逐渐消失

方法1:使用fadeOut()---不占位的让图片逐渐消失

fadeOut() 方法使用淡出效果来隐藏被选元素

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$("button").click(function() {
					$("img").fadeOut(3000);
				});
			});
		</script>
	</head>

	<body>
		<img src="img/3.jpg" width="400" /><br><br>
		<button>让图片逐渐消失</button>
	</body>
</html>

jquery如何让图片逐渐消失

方法2:使用fadeTo()---占位的让图片逐渐消失

fadeTo() 方法将被选元素的不透明度逐渐地改变为指定的值。

只需要将最终的透明度降为0即可。

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$("button").click(function() {
					$("img").fadeTo(3000,0);
				});
			});
		</script>
	</head>

	<body>
		<img src="img/3.jpg" width="400" /><br><br>
		<button>让图片逐渐消失</button>
	</body>
</html>

jquery如何让图片逐渐消失

关于“jquery如何让图片逐渐消失”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识,可以关注亿速云行业资讯频道,小编每天都会为大家更新不同的知识点。

向AI问一下细节
推荐阅读:
  1. 页面加载中jquery逐渐消失效果实现
  2. 怎么在Android中实现图片从左到右逐渐消失

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

jquery
  • 上一篇新闻:
    Go语言的指针怎么用
  • 下一篇新闻:
    elasticsearch怎么构造Client实现java客户端调用接口

猜你喜欢

  • javascript:void(0)用法及常见问题解析
  • 关于Android Service真正的完全详解
  • Java中java.lang.ClassCastException异常原因及解决方法
  • c++输入文件流ifstream用法详解
  • java并发ScheduledThreadPoolExecutor详解
  • 关于指针数组与数组指针详解
  • Windows桌面程序自动化控制之uiautomation模块全面讲解
  • 如何在Ubuntu进入root模式以及gcc的安装
  • Win7系统提示找不到d3d10level9.dll文件的解决办法
  • 如何在ubuntu上安装gcc
最新资讯
  • 如何使用Angular的ng-content指令来实现内容投影
  • 解释Angular中的Input和Output装饰器的用途
  • 如何在Angular中实现数据的双向绑定
  • 如何使用Angular的模板引用变量来访问DOM元素
  • 解释Angular中的ContentChild和ViewChild的区别
  • Angular的ngAfterViewInit生命周期钩子在何时被调用
  • 如何在Angular中创建和使用自定义指令
  • Angular的ngOnChanges生命周期钩子是如何工作的
  • 如何在Angular中实现组件之间的通信
  • 解释Angular中的Angular Material和Angular CDK的区别
相关推荐
  • 怎么用jquery让图片逐渐显示出来
  • jquery如何使得div消失
  • css如何设置图片透明度使图片逐渐消失
  • jquery如何让元素3秒后消失
  • css3如何让图片缩小至消失
  • jquery怎么让元素几秒后消失
  • jquery如何让元素缓慢消失
  • jquery如何让光标消失
  • jquery如何让元素5秒之后消失
  • jquery如何让背景图片不重复

相关标签

jquery插件 jquery图片 jquery-ui jqueryui ajax jquery jquery选择器 jquery.validate jquery打印方法 jquery对象 jquery源码 jquerymobile jquery jsplumb jquery ui jquery分页 jquery弹出层 jquery入门 jquery库 jquery.js jquery版本 jquery not
AI

深圳SEO优化公司佛山网站优化报价龙华外贸网站建设报价镇江网站推广方案推荐木棉湾网站制作报价平凉企业网站设计哪家好阿坝SEO按天收费推荐柳州网站改版哪家好德州百度网站优化价格淄博百姓网标王公司九江推广网站三亚外贸网站制作十堰建网站福州模板制作忻州SEO按天收费公司拉萨seo网站优化价格珠海企业网站设计哪家好枣庄seo网站优化推荐宿迁如何制作网站张北如何制作网站价格龙华网站优化按天扣费价格淮北至尊标王报价宣城外贸网站设计价格福永SEO按效果付费哪家好江门网站优化按天扣费多少钱宜宾高端网站设计哪家好中卫设计网站公司抚顺品牌网站设计报价黄冈网站定制价格吕梁网站优化按天扣费价格佛山SEO按天扣费价格歼20紧急升空逼退外机英媒称团队夜以继日筹划王妃复出草木蔓发 春山在望成都发生巨响 当地回应60岁老人炒菠菜未焯水致肾病恶化男子涉嫌走私被判11年却一天牢没坐劳斯莱斯右转逼停直行车网传落水者说“没让你救”系谣言广东通报13岁男孩性侵女童不予立案贵州小伙回应在美国卖三蹦子火了淀粉肠小王子日销售额涨超10倍有个姐真把千机伞做出来了近3万元金手镯仅含足金十克呼北高速交通事故已致14人死亡杨洋拄拐现身医院国产伟哥去年销售近13亿男子给前妻转账 现任妻子起诉要回新基金只募集到26元还是员工自购男孩疑遭霸凌 家长讨说法被踢出群充个话费竟沦为间接洗钱工具新的一天从800个哈欠开始单亲妈妈陷入热恋 14岁儿子报警#春分立蛋大挑战#中国投资客涌入日本东京买房两大学生合买彩票中奖一人不认账新加坡主帅:唯一目标击败中国队月嫂回应掌掴婴儿是在赶虫子19岁小伙救下5人后溺亡 多方发声清明节放假3天调休1天张家界的山上“长”满了韩国人?开封王婆为何火了主播靠辱骂母亲走红被批捕封号代拍被何赛飞拿着魔杖追着打阿根廷将发行1万与2万面值的纸币库克现身上海为江西彩礼“减负”的“试婚人”因自嘲式简历走红的教授更新简介殡仪馆花卉高于市场价3倍还重复用网友称在豆瓣酱里吃出老鼠头315晚会后胖东来又人满为患了网友建议重庆地铁不准乘客携带菜筐特朗普谈“凯特王妃P图照”罗斯否认插足凯特王妃婚姻青海通报栏杆断裂小学生跌落住进ICU恒大被罚41.75亿到底怎么缴湖南一县政协主席疑涉刑案被控制茶百道就改标签日期致歉王树国3次鞠躬告别西交大师生张立群任西安交通大学校长杨倩无缘巴黎奥运

深圳SEO优化公司 XML地图 TXT地图 虚拟主机 SEO 网站制作 网站优化