HTML结构:
<li class="layui-nav-item ruijie-nav-item">
<div class="title">SMB产品报价体系<i class="layui-icon layui-icon-down"></i> </div>
<ul class="ruijie-nav-child" style="position: absolute;">
<li><a href="#1">移动模块</a></li>
<li><a href="#2" >SMB产品报价体系</a></li>
<li><a href="#3">电商平台</a></li>
</ul>
</li>
jquery代码:
$(function(){
$(".layui-layout-body .ruijie-nav-item").hover(function (){
var self = this;
timer = setTimeout(function(){
$(self).children('.ruijie-nav-child').stop().show(500);
},300);
$(".layui-layout-body .ruijie-nav-item .title i").removeClass("layui-icon-down").addClass("layui-icon-up");
},function (){
var self = this;
remove = setTimeout(function(){
$(self).children('.ruijie-nav-child').stop(false,true).hide(500);
},300);
$(".layui-layout-body .ruijie-nav-item .title i").removeClass("layui-icon-up").addClass("layui-icon-down");
});
})
这段代码主要是为了解决低版本ie低版本浏览器不能识别layui的语义话标签控件不兼容的问题。