Question

我正在使用下面的代码在顶部显示通知，但它似乎无处不在。我希望它向下滚动类似于切换，同时按下它下面的div中的所有内容。

继承人Javascript

<script>

window.onload = function() {
    setTimeout(function() {
        document.getElementById('top').style.display = 'block';
    }, 10000);
}

</script>

HTML：

<div id="top">
    <p>content here</p>
</div>

Answer 1

使用.slideDown()而不是将display属性更改为阻止

window.onload = function () {
    setTimeout(function () {
        $('#top').slideDown()
    }, 10000);
}

Answer 2

你有这个问题用jQuery标记，并且有一个直接的jQuery函数，所以这是版本：

$(function(){
  setTimeout(function(){
    $('#top').slideDown();
  }, 10000);
});

http://api.jquery.com/slideDown/

如果您想在普通的javascript中执行此操作，我建议使用CSS3过渡，而不是修改display等属性或尝试手动执行动画。

使用CSS3和max-height的此方法示例可在此处找到：http://davidwalsh.name/css-slide

然后，您将使用javascript添加和删除类以切换所需的状态，CSS3过渡将为您执行动画。

切换而不是仅仅出现？

2 个答案: