层的滑动效果js

我想实现这样一个效果：子层向左滑动，一次滑动一定距离（如：70px；），超出父层的部分隐藏。
最好是有源代码，多谢！

解决方案 »

  1.   

    http://topic.csdn.net/u/20090902/22/4be98add-ec5e-4bfc-adbf-8eda22331fbf.html
      

  2.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "  http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="  http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="textml; charset=utf-8" />
    <title>无标题文档</title>
    </head><body>
    <div id="main" style="width:300px; overflow:hidden; position:absolute; background-color:#00FFFF; left:100px; top:100px; height:100px; border:1px solid red">
    <div id="child" style="width:30%;position:relative;left:200px;height:100%;background-color:#00FF66"></div>
    </div>
    <script type="text/javascript">
    <!--
    var Tween = {
        Quad: {
            easeOut: function(t,b,c,d){
                return -c *(t/=d)*(t-2) + b;
            }
        }
    }
    var div = document.getElementById('child');
    var b=200,c=-300,d=300,t=0;
    function Run(){
        div.style.left = Math.ceil(Tween.Quad.easeOut(t,b,c,d)) + "px";
        if(t<d){ t++; setTimeout(Run, 10); }
    }
    Run();
    //-->
    </script>
    </body>
    </html>
      

  3.   

    http://www.baidu.com<a href="www.baidu.com">试试看，别当真</a>