js 控制div 渐渐消失 渐渐出现效果

于 2008-08-07 17:25:00 发布 15326 收藏 1
分类专栏： javascript 文章标签： div 测试
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/sgear/article/details/2783527
版权
效果一：手动控制展现或消失
 
 
 
 
 
 
 
代码如下：
 
  1. <TABLE width="80%">
  2. <TBODY>
  3. <TR>
  4. <TD>效果一：手动控制展现或消失<BR><INPUT onclick="startObjVisible('objDiv');if(this.value=='点击展现'){this.value='点击隐藏'}else{this.value='点击展现'}" type=button value=点击展现></TD></TR>
  5. <TR>
  6. <TD>
  7. <DIV id=objDiv style="DISPLAY: none"><IMG src="http://www.zj-blog.com/common/images/emot/Face_21.gif">测试效果<IMG src="http://www.zj-blog.com/common/images/emot/Face_21.gif"> </DIV></TD></TR></TBODY></TABLE>
 
一直学习
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 12
    评论
专栏目录
Javascript实现div层渐隐效果的方法
10-24
主要介绍了Javascript实现div层渐隐效果的方法,涉及javascript操作页面元素与样式变化的相关技巧,需要的朋友可以参考下
div上下展开收缩 html,js实现div层缓慢收缩与展开的方法
weixin_32475629的博客
05-30 800
本文实例讲述了js实现div层缓慢收缩与展开的方法。分享给大家供大家参考。具体分析如下：这是一个层伸缩与展开的特效代码，带有点动画效果，缓慢展开，DIV+JS联合打造，看上去还不错。不受内容约束，收缩与展开的速度是可以控制的，高度、循环时间也可以改。/p>"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">层收缩var mh = 30...
简单使用js点击事件让元素消失出现
qq_60903497的博客
03-07 271
简单使用js点击事件让元素消失出现
div动态消失与显示
q56231293811的专栏
02-25 7017
前言简述html页面div动态消失，并且不占用窗体位置，用jquery就可以实现，具体的实现方法是$(“#div_id”).hide();div_id 是div标签的id号，如果想让这个标签重新显示，可以使用$(“#div_id”).show();具体案例(顺带介绍Bootstrap Switch及其用法) 案例使用了Bootstrap，Bootstrap Switch，其中Boostrap的下
div点击事件弹出层并逐渐消失
08-09
按钮点击，弹出提示层，提示层在几秒后自动消失，用于按钮点击事件的提醒
css3、jq、js三种方法实现逐渐消失
热门推荐
香蕉你个芭呐呐的博客
11-22 1万+
css3 aniamtion、jq fideOut settimeOUt
如何让div渐变消失
Lam's IT Story
07-19 1694
下面的代码可以使“添加成功”四个字4000毫秒之后渐变消失，使用slideUp进行控制，里面的毫秒参数也可以改成slow,normal,fast三个参数，setTimeout方法用来控制消失的时间。 <script type="text/javascript"> $(document).ready(function() { var add = $("#me...
js渐变，直到消失
不和贪婪的人相对 不为薄情寡义的人流泪 这世界嘲笑我的人很多 你只是其中一个 不为岁月流逝蹉跎 不随潮流的是否去附和
06-28 212
var oI = setInterval(function() { var t1 = new Date('2019-06-05 20:01:00').getTime(); var t2 = new Date().getTime(); var t = t1 - t2; var tm = ''; if (t < 1000 * 60 * 60 * 24) { ...
html图片按时自动消失,JS中如何让图片慢慢消失,随后自动再显示另一张图片?
weixin_42299427的博客
06-01 573
!DOCTYPE htmlhtmlheadmeta http-equiv=Content-Type content=text/html;charset=UTF-8 /titledemo/titlescript src=jquery-1.7.2.min.js type=text/javascript charset=utf-8/script/headstyle type=text/cssbody{m...
html元素一行显示不完收缩_JS+CSS实现DIV层的展开、收缩效果
weixin_28727975的博客
01-16 594
本文为大家分享的第一个实例：JS控制DIV层的展开、收缩效果。CSS+JS实现一个DIV层的展开/折叠效果* { margin:0; padding:0;}body { text-align:center; font:75% Verdana, Arial, Helvetica, sans-serif;}h1 { font:125% Arial, Helvetica, sans-serif; tex...
js实现图片分散到组合效果
m0_50864962的博客
08-18 327
1.html结构 <div id="container"> //这个是容器 <div class="login-bg"></div> <div class="login-bg"></div> <div class="login-bg"></div> <div class="login-bg"></div> <div
div 窗口淡入淡出渐变效果
07-29
在我的爱社区网中要显示二级频道,以前用的下拉也不太好看，所以想做个淡入淡出的div 显示，开始只是想实现这个效果，后来干脆就封装成一个方法了，有两种渐变的效果，当然大家也可以拓展，如果有什么问题或好的方法好的建议可以qq联系 303409914，也希望大家能光临我现在专注的项目 www.2shequ.com. 压缩包里直接运行test.htm 页面就可以看到效果了
js实现DIV的一些简单控制
10-30
js实现DIV的一些简单控制
js控制div层的叠加简单方法
10-21
下面小编就为大家带来一篇js控制div层的叠加简单方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
js实现键盘控制DIV移动的方法
10-24
主要介绍了js实现键盘控制DIV移动的方法,以实例形式完整的讲述了js控制div移动所涉及的css、js与html使用技巧,需要的朋友可以参考下
JS控制一个DIV层在指定时间内消失的方法
10-26
主要介绍了JS控制一个DIV层在指定时间内消失的方法,需要的朋友可以参考下
js原生实现div渐入渐出
weixin_30586085的博客
08-14 597
jq对渐入渐出进行封装，简单的使用连个方法就可以实现。fadeIn(),fadeOut();如果我们界面没有使用jq那么原生怎么实现呢？ 我们讲解一下，这个原理。当我们要实现渐入的时候，首先是让隐藏的div慢慢的显示，通过让opacity慢慢从 0.0 （完全透明）到 1.0（完全不透明）。渐出就是逻辑反过来的。 下面我们直接贴代码： css: * {margin:0; p...
js渐变显示渐变消失
ITbiyu的专栏
08-01 2999
以下是渐变的js代码(表示多余三行的要隐藏，点击"more"显示剩下的，点击“less”要逐渐隐藏)：function showAccomplishmentTableRow(){ $("#accomplishmenttable tr:hidden").first().show(2000,function(){ showAccomplishmentTableRow(); }); if($
CSS+JS实现一个DIV层的展开折叠效果
最新发布
04-19
可以使用jQuery来实现一个DIV层的展开折叠效果，具体代码如下： HTML代码： ```html <div class="wrapper"> <div class="header">点击我展开或收起内容</div> <div class="content">这是要展开或收起的内容</div> </div> ``` CSS代码： ```css .wrapper { border: 1px solid #ccc; margin: 20px; overflow: hidden; } .header { background-color: #ccc; cursor: pointer; padding: 10px; } .content { display: none; padding: 10px; } ``` jQuery代码： ```javascript $(document).ready(function() { $('.header').click(function() { $('.content').slideToggle(); }); }); ``` 这样，当点击header元素的时候，content元素就会展开或收起。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 12
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

一直学习

你的鼓励将是我创作的最大动力

¥2 ¥4 ¥6 ¥10 ¥20
输入1-500的整数
余额支付 (余额：-- )
扫码支付
扫码支付：¥2
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、C币套餐、付费专栏及课程。

余额充值