使用jQuery设置指定时间后页面指定元素隐藏

王小优
王小优
王小优
231
文章
0
评论
2015年12月8日
评论
3,308 464字阅读1分32秒

在网页上我们通常会使用弹出框或者悬浮框来对重要的信息予以展示,但有时候为了兼顾到用户体验需要让其指定几秒后自动消失,使用jQuery我们就能够轻松实现。

在制作网页的时候,我们一般会使用悬浮条幅、弹窗框等来向用户展示某些重要的信息,如公告、APP下载提示条等。一般情况下,我们会设置相应的关闭按钮,但有时候我们设置其几秒后自动消失是不是更加人性化呢?

使用jQuery设置指定时间后页面指定元素隐藏

手机端百度网页的APP下载提示框

使用jQuery可以轻松实现该效果,下面提供两段代码供君选择。

代码一:以淡出形式隐藏

  1. jQuery(document).ready(function() {
  2. $("#myElem").show().delay(5000).fadeOut();
  3. });

代码二:直接隐藏

  1. setTimeout(function(){
  2. $("#myElem").hide();
  3. },5000);

注意:上述代码中#myElem为ID="myElem"的元素,根据实际情况进行修改,5000为5000毫秒,也就是5秒。

哦对了,记得要提前引入jQuery库哦

效果

代码一的实际效果如下所示:

使用jQuery设置指定时间后页面指定元素隐藏

若文章图片、下载链接等信息出错,请在评论区留言反馈,博主将第一时间更新!如果喜欢,请打赏支持本站,谢谢大家!
  • 我的微信
  • 微信扫一扫
  • weinxin
  • 我的微博
  • 微博扫一扫
  • weinxin
王小优
接入百度云加速后解析企业邮箱教程 好文资讯

接入百度云加速后解析企业邮箱教程

昨天试了一下百度云加速,导致企业邮箱发送失败,原因是并没有正确解析邮箱导致的。我用的阿里企业邮箱,企业邮箱后台提示需要到DNS服务商添加邮箱解析。 这里以阿里云企业邮箱为例,进入企业邮箱管理,设置解析...
什么是OPCM、OCPC、OCPA广告? 好文资讯

什么是OPCM、OCPC、OCPA广告?

如果你作为广告主当你在做头条、百度信息流广告投放的时候,会看到出价策略有OPCM、OCPC、OCPA,这些是什么意思呢?跟CPM、CPC、CPA有什么不同? 想必大家都知道广告类型分CPC、CPM、C...
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: