jquery带下拉菜单和焦点图代码分享

2019-11-20 11:44:55

字体：大中小

来源：转载

供稿：网友

jquery带下拉菜单和焦点图是一款顶部通栏带二级下拉菜单和banner导航菜单代码。感兴趣的朋友快来学习学习吧
运行效果图： ----------------------查看效果下载源码-----------------------

小提示：浏览器中如果不能正常运行，可以尝试切换浏览模式。
为大家分享的jquery带下拉菜单和焦点图如下

<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>jquery带下拉菜单和焦点图</title><!-- base.css | 元素还原基础样式 --><link rel="stylesheet" type="text/css" href="templets/default/styles/base.css" /><!-- main.css | 页面主体样式 --><link rel="stylesheet" type="text/css" href="templets/default/styles/main.css" /><!-- js --><script type="text/javascript" src="templets/default/scripts/jquery-1.8.0.min.js" /></script><script type="text/javascript" src="templets/default/scripts/jquery.SuperSlide.2.1.1.js" /></script><script type="text/javascript" src="templets/default/scripts/public.js"></script></head><body> <!-- header --> <div class="header_full w_100">  <div class="header">   <!-- top_left | logo -->   <div class="logo f_l"> </div>    <!-- top_right -->   <div class="top_right f_r">    <!-- top_link -->    <div class="top_link">     <i>服务热线 12345678</i>           <span>      <a href="//www.VeVB.COm" title="登录">登录</a>      /      <A href="//www.VeVB.COm" title="注册">注册</A>/      <A href="//www.VeVB.COm" title="免费试用" >免费试用</A>     </span>    </div>    <!-- menu -->    <div class="nav_bar">     <ul class="nav clearfix">                <!-- 单一菜单 | end -->            <li class="m">       <h3><a target="_blank" href="//www.VeVB.COm" title="合作专区">合作专区</a></h3>       <ul class="sub">        <LI ><A href="//www.VeVB.COm">欢迎合作</A> </LI>        <LI ><A href="//www.VeVB.COm">合作伙伴</A> </LI>       </ul>      </li>      <li class="s">|</li>            <li class="m">       <h3><a target="_blank" href="//www.VeVB.COm" title="客户服务">客户服务</a></h3>       <ul class="sub">        <LI ><A href="//www.VeVB.COm">常见问题</A> </LI>        <LI ><A href="//www.VeVB.COm">购买指南</A> </LI>        <LI ><A href="//www.VeVB.COm">备案流程</A> </LI>        <LI ><A href="//www.VeVB.COm">售后服务</A></LI>        </ul>      </li>      <li class="s">|</li>            <li class="m">       <h3><a target="_blank" href="//www.VeVB.COm" title="我的云">我的云</a></h3>       <ul class="sub">       <LI ><A href="//www.VeVB.COm">服务控制台</A> </LI>        <LI ><A href="//www.VeVB.COm">会员中心</A> </LI>  </ul>      </li>      <li class="s">|</li>            <li class="m">       <h3><a target="_blank" href="//www.VeVB.COm" title="产品服务">产品服务</a></h3>       <ul class="sub">       <LI ><A href="//www.VeVB.COm">云主机购买</A> </LI>       <LI ><A href="//www.VeVB.COm">360XP盾甲</A> </LI>       <LI ><A href="//www.VeVB.COm">360天擎</A> </LI>       <LI ><A href="//www.VeVB.COm">数据中心</A> </LI>       </ul>      </li>      <li class="s">|</li>            <li class="m">       <h3><a href="//www.VeVB.COm" title="首页">首页</a></h3>      </li>      <li class="block"></li><!-- 滑动块 -->           </ul>    </div>    <!-- menu | end -->   </div>  </div> </div> <!-- header | end -->  <!-- banner --> <div class="full_banner">  <div class="bd"> <ul> <li style="background:url(templets/default/images/banner.jpg) #56C1ED center 0px no-repeat;"><a target="_blank" href="//www.VeVB.COm"></a></li> <li style="background:url(templets/default/images/banner3.jpg) #21BFCA center 0px no-repeat;"><a target="_blank" href="//www.VeVB.COm"></a></li> <li style="background:url(templets/default/images/banner2.jpg) #394867 center 0px no-repeat;"><a target="_blank" href="//www.VeVB.COm"></a></li> </ul> </div> <div class="hd"><ul></ul></div> </div> <!-- banner | end --> <div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';"></div></body></html>

以上就是为大家分享的jquery带下拉菜单和焦点图代码，希望大家可以喜欢。

上一篇：jQuery实现的背景动态变化导航菜单效果

下一篇：javascript中SetInterval与setTimeout的定时器用法