Fatal编程技术网
  • javascript/
  • Javascript 下面的HTML代码适用于IE 8，但不适用于FF 11。有人能告诉我如何让这在IE和FF中都起作用吗？

Javascript 下面的HTML代码适用于IE 8，但不适用于FF 11。有人能告诉我如何让这在IE和FF中都起作用吗？

javascript html

Javascript 下面的HTML代码适用于IE 8，但不适用于FF 11。有人能告诉我如何让这在IE和FF中都起作用吗？,javascript,html,Javascript,Html,下面的HTML代码在IE 8中运行良好，但在FF 11中则不行。虽然代码似乎考虑了不同的浏览器，但出于某种原因，FF并没有做到这一点。有人能告诉我如何让这个工作在IE和FF？这个想法是旋转几个可点击的图片 <html> <head> </head> <body> <ilayer id='l1'> <layer id='l2'> <div id='l1'> <div id='l3' s

下面的HTML代码在IE 8中运行良好，但在FF 11中则不行。虽然代码似乎考虑了不同的浏览器，但出于某种原因，FF并没有做到这一点。有人能告诉我如何让这个工作在IE和FF？这个想法是旋转几个可点击的图片

<html>
<head>
</head>
<body>
<ilayer id='l1'>
<layer id='l2'>
    <div id='l1'>
        <div id='l3' style='position:relative'>
        </div>
    </div>
</layer>
</ilayer>
<script language='JavaScript'>
<!--

var bannerArray = new Array();
var myCount=0;
// Banner Code Assignment
bannerArray[0] = "<a href='http://www.google.com' target='_blank'><img src='image1.jpg' BORDER=0 height='50'/></a>";
bannerArray[1] = "<a href='http://www.google.com' target='_blank'><img src='image2.jpg' BORDER=0 height='50'/></a>";
bannerArray[2] = "<a href='http://www.google.com' target='_blank'><img src='image3.jpg'     BORDER=0 height='50'/></a>";

bannerRotate();

function bannerRotate() {

if(myCount > bannerArray.length-1){myCount=0;}

// Write out rotation

if (document.all){          // it is IE
    document.all.l3.innerHTML=bannerArray[myCount];
}

else if (document.layers){  // it is NN

document.layers.l1.document.layers.l2.document.open();
document.layers.l1.document.layers.l2.document.write(bannerArray[myCount]);
document.layers.l1.document.layers.l2.document.close();
}
setTimeout('bannerRotate()', 1000);
myCount++;
}
// -->
</script>
</body>
</html>



文档。所有
和
文档。层
都是专有的和过时的。请改用
document.getElementById（）
。

您尚未指定DOCTYPE

这是HTML文档的重要部分。如果没有它，即将HTML视为无效并以怪癖模式呈现。其他浏览器不会

当我处于怪癖模式时，它基本上是呈现页面，就像在IE5中一样

这就是为什么你在IE和FF中看到的页面看起来不同。Firefox实际上正确地呈现了它；这是错误的

添加有效的DOCTYPE以使IE正确呈现它。如果不知道要使用哪种doctype，请使用此doctype：

<!DOCTYPE html>
这将使页面在所有浏览器中呈现相同

然而，IE会发生变化，所以如果您认为现在IE中的渲染效果很好，那么您可能需要对布局进行一些更改来修复它

希望有帮助

此外，您的Javascript代码非常陈旧。你需要考虑从头开始重写所有这些。没有人再使用
document.all
或
document.layers
。然而，doctype是导致页面在第一时间呈现不正确的主要因素。

只需将
if（document.all）
替换为
if（document）
，即可在Firefox中使用

会的，但不是真的，不要那样做！这是基于一些全能的黑客

无论你从哪里得到代码，现在停止使用它

网上有很多教程将向您展示如何以现代方式旋转图像显示。去找一个。

让我们把这段代码带入21世纪，不要忘记文档类型

HTML

Javascript

var listItems = document.getElementById("banner").getElementsByTagName("li");
var limiter = 0;//this is to stop it infinatly looping...optional
var activeNode = 0;

var t = setInterval(function(){bannerRotate()},1000);
function bannerRotate() {

    var listItemsCount = listItems.length;
    //LOOP THROUGH  List Items
    for(i = 0; i < listItemsCount; i++)
    {
        //Turn off all but next active node
        if(i != activeNode +1)
       {
              listItems[i].style.display = "none";
       }
        //Check if next active node is outside the list range
      else if((activeNode + 1) < listItemsCount)
      {
           listItems[activeNode +1].style.display = "block"
      }
    }

    activeNode++;
    if(activeNode >= listItemsCount)
    {
        listItems[0].style.display = "block";
        activeNode = 0;
    }

    if(limiter++ > 4)
    {    
       clearInterval(t);
    }
}

var list items=document.getElementById（“banner”）.getElementsByTagName（“li”）；
无功限制器=0//这是为了阻止它内循环…可选
var-activeNode=0；
var t=setInterval（函数（）{bannerRotate（）}，1000）；
函数bannerRotate（）{
var listItemsCount=listItems.length；
//循环浏览列表项
对于（i=0；i=listItemsCount）
{
listItems[0].style.display=“block”；
activeNode=0；
}
如果（限制器+++>4）
{    
净间隔（t）；
}
}
示例：

如果我错了，请纠正我的错误，但这难道不管用吗？if（document.all）语句只有在IE中使用时才返回true，否则它应该分支到else if。@Marten，对，但是document.layers也不会被任何现代浏览器匹配。在标题中，您应该至少给出一个您尝试执行的操作的提示。您还应该更好地描述您正在尝试做什么以及它如何“不起作用”。这种HTML和JavaScript似乎很古老，我怀疑它在任何现代浏览器中都不会起作用。你最好重写整个代码。doctype，doctype，doctype。
//它是NN
！！那么，这些天谁在使用Nestcape Navigator呢？我想这段代码最初编写时，
DOCTYPE
还没有诞生。另外，在任何文档中都找不到
layer
或
ilayer
标记，它们只是那么旧……我对在这么短的时间内得到的答案数量感到震惊！向你们所有人致意，谢谢你们给我指明了正确的方向。我在互联网上的某个地方找到了代码片段，并考虑在我的项目中使用它。作为一个完全的新手（但愿意学习），我尝试在这里发布我的问题，因为我注意到它在FF中不起作用。瞧！仅仅10分钟后，我就开始工作了！魔术谢谢你们所有人。@Marten你们应该给这些人一些投票，如果你们解决了你们的问题，你们应该接受答案：） 
#banner 
{
    list-style:none; /*Turn Off List Styling */
}

#banner li
{
display:none; /*Hide the List Items*/
}

#banner li#bannerItem1
{
    display:block;/*Show The First One */
}

var listItems = document.getElementById("banner").getElementsByTagName("li");
var limiter = 0;//this is to stop it infinatly looping...optional
var activeNode = 0;

var t = setInterval(function(){bannerRotate()},1000);
function bannerRotate() {

    var listItemsCount = listItems.length;
    //LOOP THROUGH  List Items
    for(i = 0; i < listItemsCount; i++)
    {
        //Turn off all but next active node
        if(i != activeNode +1)
       {
              listItems[i].style.display = "none";
       }
        //Check if next active node is outside the list range
      else if((activeNode + 1) < listItemsCount)
      {
           listItems[activeNode +1].style.display = "block"
      }
    }

    activeNode++;
    if(activeNode >= listItemsCount)
    {
        listItems[0].style.display = "block";
        activeNode = 0;
    }

    if(limiter++ > 4)
    {    
       clearInterval(t);
    }
}