Плавное включение / выключение и создание / скрытие <DIV> с помощью javascript

StackOverflow https://stackoverflow.com/questions/553034

Вопрос

Я создаю некоторые из них во время выполнения.Для этого я использую эту функцию:

function creatediv(id, html, left, top) {

if (document.getElementById(id)) 
    {
        document.getElementById(id).style.display='block';
        fadeIn(id, 300);
    }
    else
    {
        var newdiv = document.createElement('div');
        newdiv.setAttribute('id', id);
        newdiv.setAttribute("class", "warningDiv"); 
        newdiv.style.position = "absolute";
        newdiv.innerHTML = html  + '<h1>(click to close)</h1>';
        newdiv.style.left = left;
        newdiv.style.top = top;
        newdiv.onclick=function(e) {
            fadeOutAndHide(id, 300);
        };  
        document.body.appendChild(newdiv);
        fadeIn(id, 300);
    }

} 

Эта функция не работает с IE, и я не знаю почему.Я не получаю никаких предупреждений об ошибках с этим javascript.Это функции удаления затухания:

function fadeOutAndHide (id,millisec)
{
    var object = document.getElementById(id).style;
    var opacStart = 100;
    var opacEnd=0;
    var speed = Math.round(millisec / 100);
    var timer = 0;

    for(i = opacStart; i >= opacEnd; i--) {
        setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
        timer++;
    } 

    var elemento = document.getElementById(id);
    if (opacEnd==0){
    elemento.style.display='none';
    }
}


function opacity(id, opacStart, opacEnd, millisec) {
    var speed = Math.round(millisec / 100);
    var timer = 0;

    if(opacStart > opacEnd) {
        for(i = opacStart; i >= opacEnd; i--) {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    } else if(opacStart < opacEnd) {
        for(i = opacStart; i <= opacEnd; i++)
            {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    }
} 

Еще одна проблема, которая у меня есть:Функция fadeout не работает должным образом.Div исчезает, но событие "click" запускается, когда div скрыт.Это функция для затухания:

function fadeOutAndHide (id,millisec)
{
    var object = document.getElementById(id).style;
    var opacStart = 100;
    var opacEnd=0;
    var speed = Math.round(millisec / 100);
    var timer = 0;

    for(i = opacStart; i >= opacEnd; i--) {
        setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
        timer++;

    } 

    var elemento = document.getElementById(id);
    if (i==1){
    elemento.style.display='none';
    }
}

Итак, что я могу сделать, чтобы исправить эту проблему?

Спасибо

Это было полезно?

Решение

Извините, я не знаю, что не так с вашим кодом, но я настоятельно рекомендую вам использовать существующую библиотеку javascript (например jQuery - jQuery - запрос или инструменты обсуждения) который позволяет вам достигать таких вещей, как постепенное затухание с помощью одной строки кода, и должен работать в большинстве браузеров.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top