ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

淡入/淡出并使用javascript创建/隐藏

2019-11-08 00:36:26  阅读:233  来源: 互联网

标签:dom fadeout javascript internet-explorer-8


我在运行时创建一些.为此,我正在使用此功能:

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++;
        }
    }
} 

我遇到的另一个问题:淡出功能无法正常工作. div逐渐消失,但是当div隐藏时会触发事件“ click”.这是淡出的功能:

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库(例如jQuerymootools),该库可让您通过一行代码来实现淡入/淡出功能,并且应该可以大多数浏览器.

标签:dom,fadeout,javascript,internet-explorer-8
来源: https://codeday.me/bug/20191108/2004399.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有