css菜单或脚本don'I don’我不干ie
css menu or script don't work on ie
感谢任何能帮助我的人!
我在php上有一个css菜单,我在html:上使用了这个脚本
<script type="text/javascript">
function showPic (whichpic) {
if (document.getElementById) {
document.getElementById('imgContenedor').src = whichpic.href;
if (whichpic.title) {
document.getElementById('imgDescripcion').childNodes[0].nodeValue = whichpic.childNodes[0].nodeValue;
}
return false;
} else {
return true;
}
}
</script>
和菜单:
<div id="subopciones" class="menudesp">
<table border="0" id="tabla_submenu" cellpadding="0" cellspacing="0">
<tr>
<td id='celda_submenu'><li><a href="" id='opcion_submenu' >Mobiliario Urbano</a>
<ul>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/urbano01.jpg">  Circuito Espectacular Barcelona</a></li>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/urbano02.jpg">  Circuito Oppi Barcelona</a></li>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/urbano03.jpg">  Circuito Mupi Urbano Barcelona</a></li>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/urbano04.jpg">  Circuito Mupi Central Barcelona</a></li>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/urbano05.jpg">  Circuito Mupi Premium Barcelona</a></li>
</ul>
</li></td>
<td id='espacio_submenu'></td>
<td id='celda_submenu'><li><a href='' id='opcion_submenu' >Transporte</a>
<ul>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/transporte01.jpg">  Buses Urbanos Palma de Mallorca</a></li>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/transporte02.jpg">  Vehículos Promocionales</a></li>
</ul>
</li></td>
<td id='espacio_submenu'></td>
<td id='celda_submenu'><li><a href='productos.php?pant=digital' id='opcion_submenu' >Digital Gran Formato</a>
<ul>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/digital01.jpg">  Pantallas</a></li>
</ul>
</li></td>
<td id='espacio_submenu'></td>
<td id='celda_submenu'><li><a href='productos.php?pant=transportes' id='opcion_submenu' >Nieve</a>
<ul>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/nieve01.jpg">  Circuito Vallas Montaña</a></li>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/nieve02.jpg">  Circuito Oppis Montaña</a></li>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/nieve03.jpg">  Circuito Pilonas</a></li>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/nieve04.jpg">  Lonas Montaña</a></li>
</ul>
</li></td>
<td id='espacio_submenu'></td>
<td id='celda_submenu'><li><a href='productos.php?pant=espectacular' id='opcion_submenu' >Zonas de Ocio</a>
<ul>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/zonas01.jpg">  Circuito Parques de Ocio</a></li>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/zonas02.jpg">  Centros Comerciales</a></li>
</ul>
</li></td>
</tr>
</table>
</div>
这里是CSS
ul{
margin:0;
padding:0;
}
.menudesp li {
display:block !important;
position:relative;
font-size:12px;
color:#000000;
width:100%;
height:23px;
line-height:23px;
background-color:#EDEDED;
text-align:left;
}
.menudesp li a {
color: #000000;
font-size:10px;
display: block;
position: relative;
width: 180px;
}
.menudesp li a:hover {
color: #000;
}
.menudesp li ul {
display: none;
padding: 10px 0;
position: absolute;
margin: -8px 0px;
}
.menudesp li:hover ul {
display: block;
}
/*
.menudesp li ul li {
display: block;
float: none;
position: relative;
color: #fff;
padding: 0 20px;
line-height: 30px;
}*/
.menudesp li ul li a{
color: #444;
}
.menudesp li ul li a:hover {
color: #000;
}
.menudesp li a:hover {
color: #000;
}li a:hover {
color: #000;
} {
color: #000;
}lor: #000;
}
这里是错误图像它在chrome上运行得很好,但在IE中没有,有什么想法吗???我真的不知道该往哪里看!
尝试使用innerHTML
属性而不是nodeValue
:
function showPic (whichpic) {
if (document.getElementById) {
document.getElementById('imgContenedor').src = whichpic.href;
if (whichpic.title) {
document.getElementById('imgDescripcion').innerHTML = whichpic.innerHTML;
}
return false;
} else {
return true;
}
}
我刚刚读到有人抱怨每个人都推荐jQuery(或其他一些javascript框架),但这正是他们的用途。。。抽象掉javascript实现中固有的差异。
因此,事不宜迟,我向您介绍您的jQuery解决方案。
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
function showPic (whichpic) {
var wpic = jQuery(whichpic); // make our object jQuerified
jQuery('#imgContenedor').attr("src", wpic.attr("href"); // Set our image container
jQuery('#imgDescripcion').html(wpic.html()); // Set our image description
return false;
}
</script>
你可以更进一步,删除内联onclick并执行…
<script type="text/javascript">
jQuery("#celda_submenu li<a").click(showPic); // This will bind to all anchor (a) elements nested below an li inside an element with celda_submenu as the id.
</script>
为什么ul元素定义了两次?第一次是在桌子外面。您的HTML似乎已损坏,这肯定会导致浏览器之间的差异。
<div id="subopciones" class="menudesp">
<table border="0" id="tabla_submenu" cellpadding="0" cellspacing="0">
<tr>
<td id='celda_submenu'><li><a href="" id='opcion_submenu' >Mobiliario Urbano</a>
<ul>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/urbano01.jpg">  Circuito Espectacular Barcelona</a></li>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/urbano02.jpg">  Circuito Oppi Barcelona</a></li>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/urbano03.jpg">  Circuito Mupi Urbano Barcelona</a></li>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/urbano04.jpg">  Circuito Mupi Central Barcelona</a></li>
<li><a onclick="return showPic(this)" href="Imatges/productosnuevos/urbano05.jpg">  Circuito Mupi Premium Barcelona</a></li>
</ul>
</li></td>
</tr>
</table>
相关文章:
- 为什么这在IE中的工作方式与在Firefox中不同
- 后焦点更改为IE 11中的地址栏,而不是转移到表单中的下一个控件
- 如何在读取XLS/XLSX本地文件时,使用IE的javascript代码启用未标记为安全的ActiveX控件
- jQuery blueimp文件上传:将N-1个文件上传到IE中的服务器
- 元素在我的代码中不会.fadeTo.Don'I don’我不知道;s错误的JavaScript、JQuery、H
- 有没有一种方法可以在控制台关闭的情况下让console.log()在IE中记录消息
- 设置倒计时计时器,IE出现问题
- 仅在IE中,javascript中的时区名称不正确
- 在IE中加载Firebug Lite时出现问题
- 为什么我得到错误IE修剪方法是't支持
- Don'不允许将焦点集中在自动完成的选择上
- IE中的CSS翻转动画:翻转的一面显示镜像内容
- javascript如果图像不存在don't加载它
- 通过具有IE<11
- IE在将字符串转换为日期时从日期中删除4小时
- Target=_blank don'我不在mozilla和IE工作
- Don'在IE中调用find next时,不要高亮显示Codemirror中的光标
- javascript没有'I don’我一直在IE工作
- css菜单或脚本don'I don’我不干ie
- 美元(文档).ready don't loading in IE