zoukankan      html  css  js  c++  java
  • CSS expression VS Script event

    国庆来了,手机加油站(http://www.sjjyz.com)的首页也想带给访问客人一点喜悦的感觉,于是美工做了两个flash分别放在网页的两边空白的地方,同时想让它们随页面滚动而滚动,有浮动的感觉。
    在实现滚动的效果时,我开始按习惯用了js的事件body onscroll来做。但做好后发现在滚动时两个flash有点卡卡的感觉,像抽筋一样,给人感觉很不好,我就尝试着用css 的expression来实现效果,发现结果要好得多,抽筋的感觉一点也没有了。

    代码如下:

            <style> 
                #flashRight 
    { POSITION: absolute; TOP: expression(lockTop());    LEFT:expression(lockLeft(false)); } 
                #flashLeft 
    { POSITION: absolute; TOP: expression(lockTop());    LEFT:expression(lockLeft(true)); } 
            </style> 


     

            <script language="javascript"> 
            
    function lockTop() 
            

                
    var _body=document.body; 
                
    return _body.scrollTop; 
            }

            
    function lockLeft(left)
            
    {
                
    if(left)
                
    {
                    
    return    (screen.availWidth - 777)/2 - 134;
                }

                
    else
                
    {
                    
    return    (screen.availWidth - 777)/2 + 770;        
                }

            }

            
    </script> 

     可以看到代码也变得很简单

            <div id="flashRight">
                
             
    </div>
             
    <div id="flashLeft">
                
            
    </div>


    具体效果可以到http://www.sjjyz.com上去看,这两天会把这个改动拿上去。

  • 相关阅读:
    ecnu1624求交集多边形面积
    poj2986A Triangle and a Circle&&poj3675Telescope(三角形剖分)
    poj2194Stacking Cylinders
    zoj2589Circles(平面图的欧拉定理)
    poj1819Disks
    poj3334Connected Gheeves(二分)
    2014 Multi-University Training Contest 5
    hdu3264Open-air shopping malls(二分)
    poj1375Intervals(点到圆的切线)
    级数基础
  • 原文地址:https://www.cnblogs.com/think/p/247033.html
Copyright © 2011-2022 走看看