Question

是否可以将淡出效果淡化为javascript代码？

此刻它只是弹出一个图像并消失而没有效果。提前谢谢。

Answer 1

由于您的网站已经在使用jQuery，请查看使用jQuery fadeIn()和fadeOut()函数。

$('div').fadeOut();

Answer 2

FadeIn（）和FadeOut（）需要设置持续时间，如FadeIn（“slow”）;或FadeOut（“快”）;甚至在毫秒之内，如FadeIn（3000）;否则褪色效果不会立即发生淡入淡出效果。 setInterval（）函数只循环淡入淡出。

Answer 3

尝试以下脚本

function gradient(id, level)

{

    var box = document.getElementById(id);

    box.style.opacity = level;

    box.style.MozOpacity = level;

    box.style.KhtmlOpacity = level;

    box.style.filter = "alpha(opacity=" + level * 100 + ")";

    box.style.display="block";

    return;

}



function fadein(id) 

{

    var level = 0;

    while(level <= 1)

    {

        setTimeout( "gradient('" + id + "'," + level + ")", (level* 1000) + 10);

        level += 0.01;

    }

}

function centerPopup()
{
    var windowWidth = document.documentElement.clientWidth;
    var windowHeight = document.documentElement.clientHeight;
    //alert(windowWidth); alert(windowHeight);
    var popupHeight = 300;
    var popupWidth = 400;
    //alert(windowHeight/2-popupHeight/2); alert(windowWidth/2-popupWidth/2);
    document.getElementById(AnyElement).style.top = windowHeight/2-popupHeight/2 + 'px';
    document.getElementById(AnyElement).style.left = windowWidth/2-popupWidth/2 + 'px';
} 

function openbox(fadin)

{
    var box = document.getElementById(AnyElement);
    document.getElementById(AnyElement).style.display = 'block';

    if(fadin)

    {

        gradient("box", 0);
        fadein("box");
        centerPopup();

    }

    else

    {   

        box.style.display='block';

    }
}

function closebox()

{

    document.getElementById(AnyElement).style.display = 'none';

    document.getElementById(AnyElement).style.display = 'none';

}

淡出效果需要提供现有的javascript代码

3 个答案: