首页 > 编程语言 > 详细

JavaScript之淡入淡出

时间:2017-10-28 16:05:28      阅读:219      评论:0      收藏:0      [点我收藏+]
//正常输出
window.onload=function(){
    var div=document.getElementById(‘div‘);
    var timer=null;
    div.style.display=‘none‘;
    div.style.opacity=‘0‘;
    function fadein(elem, speed, opacity){
        elem.style.display = ‘block‘;
        elem.style.opacity = val / 100;
        var val = 0;
        (function(){
            elem.style.opacity = val / 100;
            val += 10;
            console.log(val);
            if (val <= opacity+500) {
                setTimeout(arguments.callee, speed);
            }
        })();
    }
    document.getElementById(‘btn‘).onclick=function(){
        fadein(div,1000,100);
    }
}
//不正常,无法读取elem
window.onload=function(){
    var div=document.getElementById(‘div‘);
    var timer=null;
    div.style.display=‘none‘;
    div.style.opacity=‘0‘;
    function fadein(elem, speed, opacity){
        elem.style.display = ‘block‘;
        elem.style.opacity = val / 100;
        var val = 0;
        elem.style.opacity = val / 100;
        val += 10;
        console.log(val);
        if (val <= opacity+500) {
            setTimeout(arguments.callee, speed);
        }
    }
    document.getElementById(‘btn‘).onclick=function(){
        fadein(div,1000,100);
    }
}
//不正常,一直输出10
window.onload=function(){
    var div=document.getElementById(‘div‘);
    var timer=null;
    div.style.display=‘none‘;
    div.style.opacity=‘0‘;
    function fadein(elem, speed, opacity){
        elem.style.display = ‘block‘;
        elem.style.opacity = val / 100;
        var val = 0;
        elem.style.opacity = val / 100;
        val += 10;
        console.log(val);
        if (val <= opacity+500) {
            setTimeout(function(){
                fadein(elem, speed, opacity);
            },speed);
        }
    }
    document.getElementById(‘btn‘).onclick=function(){
        fadein(div,1000,100);
    }
}
//正常输出
window.onload=function(){
    var div=document.getElementById(‘div‘);
    var timer=null;
    div.style.display=‘none‘;
    div.style.opacity=‘0‘;
    var val = 0;
    function fadein(elem, speed, opacity){
        elem.style.display = ‘block‘;
        elem.style.opacity = val / 100;
        console.log(val);
        if (val <= opacity+500) {
            val += 10;
            elem.style.opacity = val / 100;
            setTimeout(function(){
                fadein(elem, speed, opacity);
            },speed);
        }
    }
    document.getElementById(‘btn‘).onclick=function(){
        fadein(div,1000,100);
    }
}

 

JavaScript之淡入淡出

原文:http://www.cnblogs.com/chenyongyang/p/7747156.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!