jQuery slideToggle方法，改变元素display属性值

最新推荐文章于 2023-06-07 16:03:59 发布
最新推荐文章于 2023-06-07 16:03:59 发布
阅读量2.4k 收藏
点赞数
分类专栏： jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Mchange/article/details/8468349
版权

在使用jQuery的slideToggle方法实现下拉隐藏|显示动画的时候，目的是想让隐藏的div显示后，display:block； 但是结果却是：display：inline；

查看后，发现我将div的display在css中初始化位置none，用来将其隐藏，这就是问题所在。将该display去掉。在js用hide()将该元素隐藏，实验结果ok！

Mchange
关注
专栏目录
通过jQuery的slideToggle()方法实现元素的显示隐藏时，利用当前ul元素display的值判断状态遇到的问题
w1119498707的博客
04-07 485
项目场景： 通过jQuery的slideToggle()方法实现元素的显示隐藏时，利用当前ul元素display的值判断状态，点击当前p标签时，显示隐藏兄弟元素ul，当ul显示时p为灰色，隐藏则p为蓝色 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
jQuery效果 slideToggle() 方法(在隐藏和显示之间切换)
10-28
slideToggle() 方法通过使用滑动效果（高度变化）来切换元素的可见状态。
jQuery slideToggle() 方法
felixsyan的专栏
09-05 228
  slideToggle() 方法通过使用滑动效果（高度变化）来切换元素的可见状态。 如果被选元素是可见的，则隐藏这些元素，如果被选元素是隐藏的，则显示这些元素。     实例 通过使用滑动效果，在显示和隐藏状态之间切换 &lt;p&gt; 元素： $(".btn1").click(function(){   $("p").slideToggle(); });    ...
显示隐藏切换 slideToggle()方法
weixin_49098968的博客
06-07 744
当我们通过点击（还可以是其他交互方式）一个按钮来控制被选元素的显示和隐藏时，需要判断被选元素是显示状态还是隐藏状态，如果该元素是显示状态，那么点击时就需要隐藏，否则相反。 这样判断的话会很麻烦，还需要判断元素的状态，此时我们使用slideToggle() 方法就能够很好的解决这个问题。
Jquery一个slideToggle搞定div的隐藏与显示
weixin_34361881的博客
01-04 169
Jquery一个slideToggle搞定div的隐藏与显示 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"&gt; &lt;/script&gt; &lt;script&gt; $(docum
jQuery判断一个元素是否可见的方法
10-24
通过`.css('display')`获取元素的display属性值，如果值为"none"，则认为该元素是隐藏的。如果不是"none"，则认为元素是可见的。然后基于这个判断来切换按钮的背景图并应用动画效果。 方法三是将上述判断逻辑合并为...
怎样判断jQuery当前元素是隐藏还是显示
10-21
在HTML文档中，元素的显示和隐藏通常由CSS的display属性控制。当display的值为"none"时，元素被认为是隐藏的；相反，当display的值不为"none"时，元素是显示状态。 接下来，我们详细探讨如何使用jQuery来判断元素的...
jQuery实现左右滑动的toggle方法
10-18
首先，`slideToggle()`方法通常被用来实现元素的上下滑动，它会改变元素的高度属性。具体来说，当元素可见时，`slideToggle()`方法会使其以动画形式隐藏；而当元素不可见时，它又会以动画形式显示。该方法在参数中...
jquery使用slideDown实现模块缓慢拉出效果的方法
10-24
当元素从display: none状态开始时，其height属性为0，然后slideDown方法会逐渐增加该属性值，直到达到元素的实际高度，此时元素就完全显示出来了。而overflow属性在动画过程中始终为hidden，这样可以确保元素在逐渐...
jQuery中slidedown与slideup方法用法示例
10-21
这个方法会改变元素的高度，使其从0像素增长到实际高度，同时保持其他CSS属性不变。 `slideUp()`方法则与`slideDown()`相反，用于将可见元素逐渐隐藏。同样，它也接受一个可选的时间间隔参数，如`$("#message")....
jquery中添加属性和删除属性
12-10
jquery中添加属性和删除属性： 代码如下: $(“#2args”).attr(“disabled”,’disabled’); $(“#2args”).removeAttr(“disabled”); 问题背景： 选择“选项1”是，“两个参数”这个单选按钮有效。 选择“选项2”时，让“两个参数”的这个单选按钮无效。 代码： <!DOCTYPE> <html > <head> <meta charset="utf-8" /> <title>demo</title> <style type="text/css"> .control-group{ margin-bottom: 20px
js监听html元素值变化,监听元素属性改变事件的方法
weixin_33139275的博客
06-10 8751
监听元素属性改变事件的方法原创Red_Ant_hoyl2018-08-30 01:12:35著作权文章分类html技术阅读数10764©著作权归作者所有：来自51CTO博客作者Red_Ant_hoyl的原创作品，如需转载，请与作者联系，否则将追究法律责任https://blog.51cto.com/u_13479739/2166248**一、onchange事件**只在键盘或者鼠标操作改变对象属性...
显示和隐藏状态之间切换 slideToggle()
龚清林的博客
10-10 2857
通过使用滑动效果，在显示和隐藏状态之间切换 元素：$(".btn1").click(function(){ $("p").slideToggle(); });
js实现监听dom元素的属性变化
热门推荐
D_bel的博客
07-24 2万+
通过MutationObserver来实现： MutationObserver可以用来监视 DOM 变动。DOM 的任何变动，比如节点的增减、属性的变动、文本内容的变动，这个 API 都可以得到通知，也就是说DOM 发生变动就会触发回调函数，是异步触发，DOM 的变动并不会马上触发，而是要等到当前所有 DOM 操作都结束才触发。这样设计是为了应付 DOM 变动频繁的特点。举例来说，如果文档中连...
监听元素属性改变事件的方法
weixin_33973600的博客
08-30 1134
一、onchange事件只在键盘或者鼠标操作改变对象属性，且失去焦点时触发，脚本触发无效。（就是说你在输入框中输入完内容，输入完了，然后鼠标点别的地方触发该事件）二、oninput事件oninput 事件在用户输入时触发。不支持JS等赋值改变的元素属性。该事件在 <input> 或 <textarea> 元素的值发生改变时触发。（也就是说，不用输入完，边输入边触发该事件）①...
flex弹性布局教程-02-容器display设置为flex
晴空闲云
09-19 1193
本篇介绍了弹性布局的第一步，需要先将容器display设置为flex，并逐步对其中的流程进行了讲解。 阅读时间10~15分钟。
jQuery中slideToggle()的详细使用方法和解释
anshezan7542的博客
08-29 981
$(selector).slideToggle(speed,callback) 参数speed和callback Speed 可选。规定元素从隐藏到显示的速度，默认‘normal’可能的值。毫秒（比如1500），slow、normal、fast。 Callback 可选。slideToggle函数执行完之后要执行的函数，除非设置了speed函数， 否则不能设置该参...
jquery slideToggle向上隐藏
最新发布
05-15
jQuery中的slideToggle()方法可以让元素在显示和隐藏状态之间进行切换。如果您想让元素向上隐藏，可以通过设置元素的高度为0来实现。以下是一个示例代码： HTML代码： ``` 这是要隐藏的内容 点击切换显示/隐藏 ...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值