Question

我要做的是让页面的不同部分向上滑动并覆盖前一部分。我在http://johnpolacek.github.com/superscrollorama/找到了我想要做的，特别是“擦拭”部分。我尝试复制一些代码并包含相同的javascript文件。

在Firefox中，它有效。但是，在Chrome和IE浏览器中，当我尝试向下滚动时，滚动条会抖动并快速回到页面顶部。

我在网站上没有它，但我确实有我正在使用的文件：http://www.mediafire.com/?h28etrbr5t24qyw

非常感谢任何帮助（或更实际的替代方案）。

Answer 1

是的，看起来很酷。我只是从头开始创建代码，这样你就能得到你想要的代码。我刚刚创造了一些基本的东西。一个蓝色的主要div与红色div擦拭。显然你可以在两个div上放任何你想要的东西..继承人代码：

<!doctype html>
<html>
  <head>
    <style type='text/css'>
      body{
        margin: 0px;
      }
      #wipeScreen{
        position: fixed;  
        width: 100%;                  
        background-color: red;
      }

      #mainScreen{
        position: absolute;
        background-color: blue;
        height: 200%;
        width: 100%;
      }
    </style>
    <script type='text/javascript'>
      var visHeight;
      function loadConstants(){
        visHeight = Math.ceil(document.getElementById("mainScreen").offsetHeight/2);
        var wipeScreen = document.getElementById("wipeScreen");
        wipeScreen.style.height = visHeight+"px";
        wipeScreen.style.top = -visHeight+"px";
        window.onscroll = runScroller;
      }
      function runScroller(){
        document.getElementById("wipeScreen").style.top = pageYOffset-visHeight+"px";
      }    
    </script>        
  </head>
  <body onload='loadConstants()'>
    <div id='mainScreen'></div>
    <div id='wipeScreen'></div>  
  </body>
</html>

将其复制并粘贴到HTML文档中，您将看到我的意思

Javascript页面用Superscrollorama擦除过渡

1 个答案: