0

当我们淡入或淡出一个元素时，哪个 CSS 属性正在改变？是可见性还是展示性？

我想编写带有if（伪）子句条件的代码：

when the div is visible, do something

例子：

if ( $('#div').is(':visible') ) {
  do something;
}

...但我不确定 CSS 中的哪个属性或属性已更改。

4

4 回答 4

1

fadeIn()会将opacityfrom更改0为1（假设元素从一开始就隐藏）。

display动画完成后将设置为block（默认为 400 毫秒）。

fadeOut()相反。

于 2013-09-25T12:05:03.593 回答
0

据我所知，它会改变 opacity 属性，而不是 display 或 visibility 属性，这将跨浏览器工作，所以如果它是 firefox -moz-opacity 会改变等。

http://api.jquery.com/fadeIn/

于 2013-09-25T12:05:12.597 回答
0

当你使用fadeOut()任何元素时，它的不透明度从 1 切换到 0，并且显示属性设置为无。在方法中发生相反的情况fadeIn()（显示属性设置为块。）

于 2013-09-25T12:06:00.263 回答
0

不透明度。

你也可以自己测试一下。如果您设置了一个长的淡出（即：10 秒），那么您可以打开浏览器控制台并检查值的变化。

在您的 HTML 文档中添加以下代码：

HTML

<div id="testItem"></div>

CSS

#testItem
{
    display : block;
    width   : 100px;
    height  : 100px;
    background: #0AF;
}

JavaScript/jQuery

jQuery(document).ready(
    function(e)
    {
        $('#testItem').click(
            function(e)
            {
                $(this).fadeOut(10000);
            }
        );
    }
);

然后，用 Chrome 打开文档并右键单击我们刚刚创建的 div 元素。从打开的菜单中选择“检查元素”（如果您的浏览器使用其他语言，它应该是菜单的最后一个选项）。然后，Chrome 控制台应该是打开的，并且应该已经标记了 .

最后，单击 div 元素，您将看到当您淡出/进入某个元素时会发生什么。

于 2013-09-25T12:06:11.587 回答