html - 动画溢出将不起作用

标签 html css animation overflow

我正在努力防止在我的网站上溢出,即使我有带动画的 div。 你可以在this link看到它.

我做了 overflow-x:hidden 溢出-y:隐藏

在正文、html、页眉、页脚和云 div 上。 它在桌面浏览器上运行良好,但在移动设备上您可以垂直和水平滚动。

这是为什么呢?我的代码没有什么奇怪的。动画从 -200 像素开始,到 2000 像素结束(左)。

这是我的 HTML:

> <!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
            <meta name = "viewport" content = "width=device-width, height=device-height, minimum-scale=1, maximum-scale=1">
            <meta name = "apple-mobile-web-app-capable" content = "yes" /> 
            <link type="text/css" rel="stylesheet" href="css/normalize.css">
            <link type="text/css" rel="stylesheet" href="css/style.css">
        <title>Tweezers</title>
    </head>

    <body>

        <h2 class="tk-expo-sans-pro">we're working on our awesome website</h2>
        <img id="logo" src="img/logo.gif"/>
        <div class="land"></div>
        <div class="cloud1"></div>
        <div class="cloud2"></div>
        <div class="cloud3"></div>
        <footer>
            <h3 class="tk-expo-sans-pro">meanwhile you can reach us via:</h3>
            <a href="http://facebook.com/tweezers.co"><div class="icon-uniE600"></div></a>
            <div class="icon-uniE601"></div>
            <div class="icon-uniE602"></div>
            <div class="icon-uniE603"></div>
        </footer>
        <!---JS FILES-->
        <script type="text/javascript" src="//use.typekit.net/cxg8ost.js"></script>
        <script type="text/javascript">try{Typekit.load();}catch(e){}</script>
    </body>

</html>

我错过了什么? 谢谢,波阿斯。

最佳答案

您在哪个移动设备和哪个浏览器中检查您的页面?

Firefox 18 Android 设备也存在类似问题。请引用:http://jbkflex.wordpress.com/2013/04/04/css3-transformations-showing-content-outside-overflowhidden-region-in-firefoxandroid/

关于html - 动画溢出将不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25619421/

相关文章:

css - 覆盖 :hover text-decoration in a different class

php - 在 XAMPP 中使用 CONSTANT 路径时无法看到图像

Python BeautifulSoup 替换 img src

css - 表内容边距

javascript - 为什么这个悬停事件会在页面加载时触发?

iphone - 从左向右翻转iOS 4之前的UIView

html - 奇怪的 CSS 动画问题,<a> 标签覆盖 Chrome 中的动画

html - 如何使用粘性顶部导航、侧边栏和页脚开发 Bootstrap 布局

html - 我如何将此菜单转换为响应式菜单?

css - 在 wordpress 中,如何将标签添加到 divs 类