替代jQuery的slideDown()和slideUp()而不影响display属性的方法 [英] Alternative to jQuery's slideDown() and slideUp() not affecting the display property

问题描述

我一直在尝试对正在使用的网站使用slideDown()效果，但是我很难获得想要的效果.这是一个示例，显示了我要完成的工作.

I've been trying to use the slideDown() effect for a website I'm working on, but I'm having difficulty getting the effect I want. Here's a sample showing what I want to accomplish.

<div>
    blahblahblahblah

    <span id="span_more" style="display:none">
        blahblahblah
    </span> 

    <a class="link_more" id="more">More&hellip;</a></div>
</div>

基本上，当单击更多..."时，我希望通过滑动效果显示当前隐藏的文本，同时使其与可见文本的末尾保持一致.对于slideDown()来说，这似乎是不可能的，因为它正在将显示更改为阻塞.

Basically, when "More..." is clicked, I want the text that's currently hidden to appear using a sliding effect while staying inline with the end of the visible text. This doesn't seem possible with slideDown() because it is changing display to block.

非常感谢您.

推荐答案

不幸的是，这基本上是不可能的. jQuery的动画依赖于具有高度和宽度的元素.内联元素没有设置或设置这些尺寸，因此动画(无论使用animate还是slideUp)必须使它们成为块级元素.

Unfortunately, this is essentially impossible. jQuery's animation relies upon the element having height and width. Inline elements do not have these dimensions set or settable, so animations (whether using animate or slideUp) must make them block-level elements.

fadeIn确实有效，并且可能是一个有用的替代方法.

fadeIn does work, and may be a useful alternative.

这篇关于替代jQuery的slideDown()和slideUp()而不影响display属性的方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！