Animate.CSS添加滚动条?

时间:2012-09-02 04:11:56

标签: css css3 css-transitions css-animations animate.css

我正在使用Animate.CSS而我正在使用“铰链”效果让图像从屏幕上掉下来。当它离开屏幕时,它会向页面添加一个垂直滚动条。滚动时,没有任何内容可见。为什么要添加此滚动条以及如何防止它被添加?

谢谢!

代码:

HTML

<img id="animate" class="fear" src="/2012/images/september/fear-sign.png" />

CSS

.fear{
     position:absolute;
     left:150px;
     top:0px;
}

#animate {
    -moz-animation-delay: 5s;
    -webkit-animation-delay: 5s;
    -o-animation-delay: 5s;
    -ms-animation-delay: 5s;
    animation-delay: 5s;
}

JS

var $j = jQuery.noConflict();
   $j(document).ready(function() {
       $j('#animate').addClass('animated hinge');
           });

这是我创建的fiddle

3 个答案:

答案 0 :(得分:6)

您可以使用overflow:hidden,这会阻止滚动条:

html,body { overflow: hidden; }

小提琴:http://jsfiddle.net/FafAH/2/

答案 1 :(得分:2)

添加

body{overflow:hidden;}

答案 2 :(得分:0)

您可以将overflow-y设置为隐藏以防止垂直滚动条,而将overflow-x设置为隐藏以防止水平滚动条。

html, body{
    overflow-y: hidden;
}