2014-09-02 30 views
0

我試圖防止我的網站溢出,即使我有流動與動畫外面的div。 你可以在this link看到它。溢出動畫將無法正常工作

我做overflow-x:hidden overflow-y:hidden

在身上,HTML,頁眉,頁腳和雲的div。 它在桌面瀏覽器上工作得很好,但在移動設備上,您可以同時滾動垂直和水平。

這是爲什麼?我的代碼中沒有什麼奇怪的。動畫開始於-200px並結束於2000px(左側)。

這是我的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> 

什麼我失蹤?謝謝,波阿斯。

回答

0

嘗試添加以下元標記在HTML頁面中,

<meta name="viewport" content="width=device-width,height=device-height"> 
+0

我有它(編輯的問題,添加了html代碼)..它仍然有這個奇怪的移動溢出。奇怪:( – BoazKG 2014-09-02 09:43:07

+0

)你嘗試過溢出:隱藏嗎? – 2014-09-02 09:49:35

+0

當然,我有溢出:隱藏在我所有的容器上,我甚至做了overflow-x和overflow-y隱藏 – BoazKG 2014-09-02 09:50:43