0

我使用Dreamweaver的预设javascript代码段为导航栏@http://www.skyboxlabs.com制作了一些翻转。如何删除预制Dreamweaver javascript代码在IE中创建的额外空白

其有趣 - 导航栏在所有浏览器中都很棒(没有额外的空白区域),除了Internet Explorer。

JavaScript代码似乎在IE中放置额外的空白。我尝试禁用Javascript并且问题消失,所以我知道它与预设的Dreamweaver代码有关。

我用下面的网站在不同的浏览器中查看..非常有帮助。您可以看到IE9版本如何在包含javascript的TD元素下面呈现空白区域。

http://netrenderer.com/index.php

明显的升值,我怎么可能会删除在IE9中,额外的空格任何提示 - 这可能有助于解释使用Dreamweaver的JavaScript以及它如何影响布局的问题。

在此先感谢任何人,已经走到这一步我:)

下面是HTML中的1)导航栏表2)外部JavaScript文件中的代码和3)CSS

的有问题的导航栏位于主标题图像下方,并具有四个按钮 - “约”,“工作”,“领导”和“位置”。

// HTML文档

</head> 

<!-- HEADER IMAGE AND NAVIGATION BAR --> 
<body onload="MM_preloadImages('images/nav_mouseover_LEADERSHIP.gif','images/nav_mouseover_JOBS.gif','images/nav_mouseover_LOCATION.gif')"> 
<div id = "bgtop"> 
<table width="960" border="0" align="center"> 
     <tr> 
      <td><img src="images/header_ABOUT.jpg" width="960" height="240" alt="about" /></td> 
     </tr> 
     </table> 
     </div> 

     <div id = "greyBackground"> 
    <table class = "buttons" width="960" border="0" align="center">   
     <tr> 
     <td width = 160 > 

      </td> 

      <td width = 80><img src="images/nav_selected_ABOUT.gif" width="80" height="25" alt="about" /></td> 
       <td width = 160> 
      <a href="leadership.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('leadership','','images/nav_mouseover_LEADERSHIP.gif',1)"><img src="images/nav_static_LEADERSHIP.gif" alt="leadership" name="leadership" width="160" height="25" border="0" id="leadership" /></a></td> 
       <td width = 80> 
       <a href="jobs.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Jobs','','images/nav_mouseover_JOBS.gif',1)"><img src="images/nav_static_JOBS.gif" alt="Jobs" name="Jobs" width="80" height="25" border="0" id="Jobs" /></a></td> 
       <td width = 80> 
       <img src="images/nav_static_JOBS_bumper_right.gif" width="160" height="25" /></td> 

       <td width = 160> 
      <a href="location.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('location','','images/nav_mouseover_LOCATION.gif',1)"><img src="images/nav_static_LOCATION.gif" alt="location" name="location" width="160" height="25" border="0" id="location" /></a></td> 
      <td> 
      <img src="images/nav_static_LOCATION_bumper_right.gif" width="160" height="25" /></td> 
     </tr> 
    </table> 

// JavaScript的文档

function MM_swapImgRestore() { //v3.0 
    var i,x,a=document.MM_sr; 
    for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) 
    x.src=x.oSrc; 
} 

function MM_preloadImages() { //v3.0 
    var d=document; 
    if(d.images){ 
    if(!d.MM_p) d.MM_p=new Array(); 
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; 
    for(i=0; i<a.length; i++) 
     if (a[i].indexOf("#")!=0){ 
      d.MM_p[j]=new Image; d.MM_p[j++].src=a[i]; 
      } 
     } 
} 

function MM_findObj(n, d) { //v4.01 
    var p,i,x; 
    if(!d) d=document; 
    if((p=n.indexOf("?"))>0&&parent.frames.length) { 
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} 
    if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; 
    for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); 
    if(!x && d.getElementById) x=d.getElementById(n); return x; 
} 

function MM_swapImage() { //v3.0 
    var i,j=0,x,a=MM_swapImage.arguments; 
    document.MM_sr=new Array; 
    for(i=0;i<(a.length-2);i+=3) 
    if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; 
    if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2]; 
    } 
} 

// CSS文件

body { 
    margin: 0px; 
} 

html, table, tr, td 
{ 
    padding: 0; 
    border: 0; 
    font-family: Tahoma, Geneva, sans-serif; 
    font-size: 100%; 
    border-collapse: collapse; 
    border-spacing: 0; 
    vertical-align: baseline; 
    margin-top: 0px;  
} 

footer, header, hgroup, menu, nav, section 
{ 
    display: block; 
} 

ol, ul { 
    list-style: disc; 
} 
blockquote, q { 
    quotes: none; 
} 
blockquote:before, blockquote:after, 
q:before, q:after { 
    content: ''; 
    content: none; 
} 
table { 
    border-collapse: collapse; 
    border-spacing: 0; 
    background-color: #fff; 
} 
#footer 
{ 
    color:#9D0000; 
} 
#footerTitle 
{ 
    color: #9D0000 ; 
    font-weight: bold; 
} 

.buttons 
{ 
padding: 0; border-collapse: collapse; border: 0; 
} 
.buttons img { 
    display: block; 
} 
.title 
{ 
font-weight:bold; 
} 

/* BACKGROUNDS */ 

#bgtop{ 
    background-image: url(images/gridBackground.gif); 
} 

#greyBackground{ 
background-image: url(images/greyBackground.gif); 
background-repeat:repeat-y;  
/* background-color: bfbfbf; */ 
} 
#foot 
{ 
background-image: url(images/footerGradient.gif); 
} 

.img{ 
display:block; 
} 

回答

0

Internet Explorer可能会自动添加一些边距,因为您的标记为not valid。修复链接中列出的问题,并查看IE的行为是否更好。如果不是,则考虑明确声明表格单元格元素和img标签的零边距和填充。