Javascript 如何使div文本淡入_Javascript_Function_Html

Javascript 如何使div文本淡入

javascript function html

Javascript 如何使div文本淡入,javascript,function,html,Javascript,Function,Html,我正在使用javascript使div中的文本在页面加载时淡入。这似乎是可行的，但大多数情况下，文本最初在页面加载时显示约半秒钟，然后消失，然后像预期的那样淡入淡出。我尝试将javascript移动到标题、body标记上方和/body标记下方。它的运行方式总是一样的。谢谢 <body onload="javascript:ShowDiv('Layer63');"> <div id="Layer63" class="style1z"> <span class="st

我正在使用javascript使div中的文本在页面加载时淡入。这似乎是可行的，但大多数情况下，文本最初在页面加载时显示约半秒钟，然后消失，然后像预期的那样淡入淡出。我尝试将javascript移动到标题、body标记上方和/body标记下方。它的运行方式总是一样的。谢谢

<body onload="javascript:ShowDiv('Layer63');">

<div id="Layer63" class="style1z">
<span class="style16">“Line 1 of fade in text"<br />
“Line 2 of fade in text"</span><br />
-<span class="style12">“Line 3 of fade in text"</span></div>

</body>

<script>
function ShowDiv(name){
//duration of transition (1000 miliseconds equals 1 second)
var duration = 1500;
// how many times should it should be changed in delay duration
var AmountOfActions=30;

var diiv= document.getElementById(name);
diiv.style.opacity = '0';   diiv.style.display = 'block';   var counte=0;
setInterval(function(){counte ++;
   if ( counte<AmountOfActions) { diiv.style.opacity = counte/AmountOfActions;}
},
duration / AmountOfActions);
}
</script>


“淡入文本的第1行”

“淡入文本的第2行”

-“淡入文本的第3行”
函数ShowDiv（名称）{
//转换持续时间（1000毫秒等于1秒）
var持续时间=1500；
//延迟持续时间应更改多少次
var Amountos=30；
var diiv=document.getElementById（名称）；
diiv.style.opacity='0'；diiv.style.display='block'；var counte=0；
setInterval（函数（）{counte++）；
如果（counte尝试放置以下css属性：
#Layer63 {
  opacity: 0;
  display: none;
}

既然你要从0开始设置不透明度动画，并将你的显示设置为用js阻止，为什么不在pageload中隐藏它们？
你考虑过在中使用fadeIn（）方法吗
如果您想使用纯JavaScript，也可以从那里提取代码：
您使用的浏览器是什么？
$(document).ready(function() {
    $("#Layer63").fadeIn(1000);
});