Jquery 加载时Jmenu呈现问题
我使用jQueryJMenu显示菜单。在IE8中加载页面时,它显示为列表视图。 加载后,几秒钟后显示为正常水平视图。而它在Chrome浏览器上运行良好。 请帮忙。这就是我们正在使用的css。它在加载菜单时以HTML格式显示数据。加载期间未在菜单上应用jquery css文件Jquery 加载时Jmenu呈现问题,jquery,jmenu,Jquery,Jmenu,我使用jQueryJMenu显示菜单。在IE8中加载页面时,它显示为列表视图。 加载后,几秒钟后显示为正常水平视图。而它在Chrome浏览器上运行良好。 请帮忙。这就是我们正在使用的css。它在加载菜单时以HTML格式显示数据。加载期间未在菜单上应用jquery css文件 .jMenu { display: table; margin: 0; padding: 0 } /* First level */ .jMenu li { display: inline;
.jMenu {
display: table;
margin: 0;
padding: 0
}
/* First level */
.jMenu li {
display: inline;
background-color: rgb(000,063,096);
margin: 0;
}
.jMenu li a {
padding: 10px;
display: inline;
background-color: transparent;
color: white;
text-transform: capitalize;
cursor: pointer;
font-size: 12px;
}
/* Lower levels */
.jMenu li ul {
display: none;
position: absolute;
z-index:9999;
padding: 0;
margin: 0;
}
.jMenu li ul li {
background-color: rgb(000, 063, 096);
display: block;
border-bottom: 1px solid #484548;
padding: 0;
}
.jMenu li ul li.arrow {
background-color: rgb(000, 063, 096);
background-image: url('../images/arrow_down.png');
background-repeat: no-repeat;
background-position: center center;
height: 6px;
padding: 0;
border-bottom: none;
padding-bottom: 10px
}
.jMenu li ul li a {
font-size: 11px;
text-transform: none;
padding: 5px;
display: block;
border-top: 1px solid transparent;
border-bottom: 1px solid transparent;
}
.jMenu li ul li a.isParent {
background-color: #f2f2f2 ;
background-image: url('../images/arrow_right.png');
background-repeat: no-repeat;
background-position: right center;
color: #000000;
}
.jMenu li ul li a:hover {
background-color: #c4e0f6;
border-top: 1px solid #c4e0f6;
border-bottom: 1px solid #c4e0f6;
color: #000000;
}
使用文本绑定HTML格式标记
<table border="0" cellspacing="0" width="100%">
<tr>
<td style="width: 100%" class="topMenuBar">
<asp:Literal ID="Literal1" runat="server"></asp:Literal>
</td>
</tr>
</table>
Jquery函数
<link rel="stylesheet" type="text/css" href='<%# ResolveUrl("~/jMenu-master/css/jMenu.jquery.css") %>'/>
<script type="text/javascript" src='<%# ResolveUrl("~/jMenu-master/js/jquery.min.js") %>'></script>
<script type="text/javascript" src='<%# ResolveUrl("~/jMenu-master/js/jquery-ui.js") %>'></script>
<script type="text/javascript" src='<%# ResolveUrl("~/jMenu-master/js/jMenu.jquery.js") %>'></script>
<script type="text/javascript">
$(document).ready(function () {
$("#jMenu").jMenu({
ulWidth: '150',
effects: {
effectSpeedOpen: 300,
effectTypeClose: 'slide'
},
animatedText: false
});
});
</script>
![this is how html format coming while loading menus]
$(文档).ready(函数(){
$(“#jMenu”).jMenu({
ulWidth:'150',
影响:{
开放时间:300,,
effectTypeClose:“幻灯片”
},
动画文本:false
});
});
![这就是加载菜单时html格式的实现方式]
试试这个-在我们的例子中,我们用ul显示菜单,并且我们最初根据控件的样式属性隐藏它。在完成页面呈现和jquery方法绑定之后,使用css或您的便利性显示它
<ul class="menu-hvr" id="jMenu" style="display:none">
@if (!showUserMenu)
{
<li class="buttonFirstAll homebtn1">
<a href="/sign-up">sign up</a>
</li>
<li class="homebtn2">
<a href="/sign-in/?popup=true">sign in</a>
</li>
}........
</ul>
上面提到了我的代码。请帮忙,也许这是ie的问题,也许给我们你的ie版本,并尝试检查你的css