在#menu放置li菜单
<div id="menu">
<ul>
<li>
<div class="menu_li"><img src="images/coin.png" width="10" /> 网页特效</div>
<img class="line" src="images/line.png" width="1">
<span>
<img src="images/navbg4.png" width="100%">
<div>
<a href="https://jy.tp.yuanmeng.life/">html5模板</a>
<a href="https://jy.tp.yuanmeng.life/">手机js特效</a>
<a href="https://jy.tp.yuanmeng.life/">微测试</a>
<a href="https://jy.tp.yuanmeng.life/">微游戏</a>
</div>
</span>
</li>
<li>
<div class="menu_li"><img src="images/coin.png" width="10" /> 手机特效</div>
<img class="line" src="images/line.png" width="1" />
<span>
<img src="images/navbg4.png" width="100%" />
<div>
<a href="https://jy.tp.yuanmeng.life/">咨询购买</a>
</div>
</span>
</li>
</ul>
</div> 点击li菜单触发事件
window.onload = function() {
$('#menu ul li').each(function(j) {
$('#menu ul li').eq(j).removeClass("on");
$('#menu ul li span').eq(j).animate({bottom: -$('#menu ul li span').eq(j).height()}, 100);
});
}
$('#menu ul li').each(function(i) {
$(this).click(function() {
if ($(this).attr("class") != "on") {
$('#menu ul .on span').animate({bottom: -$('#menu ul .on span').height()}, 200);
$('#menu ul .on').removeClass("on");
$(this).addClass("on");
$('#menu ul li span').eq(i).animate({bottom: 35}, 200);
$('.footer_front').show();
} else {
$('#menu ul li span').eq(i).animate({bottom: -$('#menu ul li span').eq(i).height()}, 200);
$(this).removeClass("on");
$('.footer_front').hide();
}
});
});
$('.footer_front').click(function() {
$('#menu ul .on span').animate({bottom: -$('#menu ul .on span').height()}, 200);
$('#menu ul .on').removeClass("on");
$(this).hide();
});
*
回帖描述:*
链接类型:*
下载链接:*
描述:*
回帖描述:*
链接类型:*
阅读权限:*
下载链接:



聚优部落技术论坛 © 版权所有 鲁ICP备15007479号-6
Copyright(C)web.com, All Rights Reserved.
