эффект постепенного затухания необходим для существующего кода javascript

Можно ли применить эффект постепенного исчезновения к коду javascript, пожалуйста?

На данный момент это просто всплывающее изображение и исчезает без применения эффекта. Заранее спасибо.


javascript image html css fade
person user961239    schedule 26.09.2011    source источник

Ответы (3)


arrow_upward
0
arrow_downward

Для FadeIn() и FadeOut() требуется установка длительности, например FadeIn("slow"); или FadeOut("быстро"); или даже в миллисекундах, например FadeIn(3000); в противном случае эффект затухания на самом деле не является эффектом затухания, поскольку он происходит мгновенно. Функция setInterval() зацикливает только фейды.

person adeneo    schedule 26.09.2011
comment
не совсем уверен, как это работает, извините, у меня еще нет постепенного исчезновения? Спасибо - person user961239; 26.09.2011
comment
Хорошо, я предположил, что вы используете затухание, поскольку страница, на которую вы ссылаетесь, использует затухание jQuery и затухание, и это почти в верхней части источника в функции setInterval. Посетите страницы jQuery и посмотрите на эти функции, их довольно легко применить к изображению, и всегда есть этот сайт, если у вас возникнут проблемы. - person adeneo; 26.09.2011
comment
Код обновлен, но все равно не работает... jsfiddle.net/5mpfY/10 Большое спасибо. аденео за вашу помощь до сих пор .. - person user961239; 26.09.2011

arrow_upward
1
arrow_downward

Поскольку ваш сайт уже использует jQuery, попробуйте использовать jQuery fadeIn() и fadeOut().

$('div').fadeOut();
person Michael    schedule 26.09.2011

arrow_upward
0
arrow_downward

попробуйте приведенный ниже скрипт

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';

}
person nilesh1006    schedule 17.02.2012