码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript之淡入淡出

时间:2017-10-28 16:32:08      阅读:194      评论:0      收藏:0      [点我收藏+]

标签:ntb   load   element   func   timer   var   pac   set   nts   

//正常输出
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之淡入淡出

标签:ntb   load   element   func   timer   var   pac   set   nts   

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

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!