软件开发培训班 >> 编程开发 >> JavaScript

javascript 缓冲效果实现代码

　　本文标签：javascript,缓冲效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<style> 
#divid{width:30px; height:30px;left:200px;top:0px;background:#666;position:absolute;opacity:0.1;filter:alpha(opacity=10);} 
span{display:block;padding:5px; cursor:pointer;font-size:12px;} 
</style> 
<script> 
//如果事件中有opacity属性：则页面样式中要定义：opacity:0.1;filter:alpha(opacity=10); 
function spaceTo(id,u,mx,fun) 
{ 
    var o=$(id),n,s=/*@cc_on!@*/false,t=u+u*(u-1)/2;//递增总数; 
    for(n in mx){mx[n]=li(n);} 
    clearInterval(window[id+"spaceTo"]);window[id+"spaceTo"]=setInterval(mov,10); 
    function mov() 
    { 
        for(n in mx) 
        { 
            mx[n][1]=mx[n][1]+mx[n][3]*u; 
            mx[n][0][n]=n=="opacity"&&!s?Math.round(mx[n][1])*0.01:Math.round(mx[n][1])+mx[n][4]; 
        } 
        if(u==1){clearInterval(window[id+"spaceTo"]);}else{u--;} 
    } 
    function li(name)//属性，原始值，目标值，递增步长，单位 
    { 
        switch (name) 
        { 
            case "width":    return    [o.style,o.offsetWidth,mx["width"],(mx["width"]-o.offsetWidth)/t,"px"]; 
            case "height":    return    [o.style,o.offsetHeight,mx["height"],(mx["height"]-o.offsetHeight)/t,"px"]; 
            case "left":    return    [o.style,o.offsetLeft,mx["left"],(mx["left"]-o.offsetLeft)/t,"px"]; 
            case "top":        return    [o.style,o.offsetTop,mx["top"],(mx["top"]-o.offsetTop)/t,"px"]; 
            case "scrollTop":return [o,o.scrollTop,mx["scrollTop"],(mx["scrollTop"]-o.scrollTop)/t,0]; 
            case "scrollLeft":return[o,o.scrollLeft,mx["scrollLeft"],(mx["scrollLeft"]-o.scrollLeft)/t,0]; 
            case "opacity":return    s?[o.filters.alpha,o.filters.alpha.Opacity,mx["opacity"],(mx["opacity"]-o.filters.alpha.Opacity)/t,0]: 
                                    [o.style,o.style.opacity*100,mx["opacity"],(mx["opacity"]-o.style.opacity*100)/t,0]; 
        } 
    } 
} 
function $(id,tag){var re=(id&&typeof id!="string")?id:document.getElementById(id);if(!tag){return re;}else{return re.getElementsByTagName(tag);}} 
</script> 
</head>

</body> 
</html>

技术文章快速查找

个人总结的一些关于String、Function、Array的属性和用法

javascript 图片放大缩小功能实现代码

js设置cookie过期及清除浏览器对应名称的cookie

原生js事件的添加和删除的封装

JS 日期操作代码，获取当前日期，加一天，减一天

javaScript window.event.keyCode 集合与测试方法

jquery 插件开发方法小结

初学JavaScript第一章

相关下载

在线教程导航

软件应用
·Windows8	·Windows7	·Word
·Excel	·PPT	·WPS
Web开发
·ASP	·JavaScript	·DIV+CSS
·JSP	·VbScript	·XML
·PHP
开发语言
·VB	·VC	·ASP.NET
·Java	·C++	·Delphi
数据库开发
·MySQL	·MsSQL	·Access
·Oracle	·DB2
手机系统
·Android	·iOS	·WindowsPhone
网站设计
·Flash	·Dreamweaver	·Fireworks
平面设计
·Photoshop	·CorelDraw	·AutoCAD
·3DsMAX	·Illustrator
网络技术
·网站运营	·网络安全	·网络搭建

软件开发培训班 >> 编程开发 >> JavaScript

javascript 缓冲效果 实现代码

javascript 缓冲效果实现代码