jquery室内设计网站导航和图片滚动布局代码
导航菜单 次 2018-07-03探索室内设计灵感，我们的jQuery网站助您一臂之力。精美导航菜单，引领您畅游设计世界；图片滚动布局，呈现视觉盛宴。高效代码，轻松打造专业室内设计网站，让您的创意无限发挥。
jquery 实现左右轮播滚动以及左侧导航菜单效果布局，基于superslide开发，jquery均有注释，参数可修改，下载即可使用。
[声明] 墨鱼部落格所有资源为用户免费分享产生，若发现您的权利被侵害，请点击后方链接查看并联系我们，我们尽快处理。免责声明|侵权处理流程
使用方法：
1、head引入css文件
<link href="css/style.css" rel="stylesheet" type="text/css"/>
2、head引入js文件
<script src="js/jquery.min.js"></script> <script src="js/jquery.SuperSlide.2.1.1.js"></script>
3、body引入HTML代码
<div class="des-menu-nav">
<div class="des-nav-box">
<dl>
<dd class="cur">
<h3>
<a href="#">首页</a>
</h3>
</dd>
<dd>
<h3>
<a href="#">精选家装</a>
</h3>
<ul>
<li>
<a href="#">家装图库</a>
</li>
</ul>
</dd>
<dd>
<h3>
<a href="#">精选工装</a>
</h3>
<ul>
<li>
<a href="#">工装图库</a>
</li>
</ul>
</dd>
<dd>
<h3>
<a href="#">找设计师</a>
</h3>
</dd>
<dd>
<h3>
<a href="#">名家汇</a>
</h3>
<ul>
<li>
<a href="#">案例解析</a>
</li>
<li>
<a href="#">人物专访</a>
</li>
</ul>
</dd>
<dd>
<h3>
<a href="#">有问必答</a>
</h3>
</dd>
</dl>
<dl class="fr">
<dd>
<h3>
<a href="#">设计师专区</a>
</h3>
<ul>
<li>
<a href="#">3DMAX模型下载</a>
</li>
<li>
<a href="#">设计资讯</a>
</li>
<li>
<a href="#">人脉广场</a>
</li>
<li>
<a href="#">空间谈</a>
</li>
</ul>
</dd>
</dl>
<div class="des-column">
<div class="des-column-list">
<div class="hd des-column-head">
<ul>
<li class="item">
<h2>家装设计</h2>
<div class="des-column-link">
<a href="#" class="des-red">三居</a>
<a href="#" class="des-red">小户型</a>
<a href="#">别墅豪宅</a>
<a href="#" class="des-red">复式</a>
<a href="#">样板房</a>
<a href="#">日式</a>
<a href="#" class="des-red">北欧</a>
<a href="#">地中海</a>
<a href="#" class="des-red">中式</a>
<a href="#" class="des-red">现代</a>
<a href="#">混搭</a>
<a href="#" class="des-red">美式</a>
</div>
<ul class="product-wrap product-wrap001">
<li>
<h2>户型</h2>
<div class="des-column-link">
<a href="#">小户型</a>
<a href="#">二居</a>
<a href="#">三居</a>
<a href="#">四居</a>
<a href="#">复式</a>
<a href="#">别墅豪宅</a>
</div>
</li>
<li>
<h2>风格</h2>
<div class="des-column-link">
<a href="#">欧式</a>
<a href="#">中式</a>
<a href="#">新古典</a>
<a href="#">东南亚</a>
<a href="#">美式</a>
<a href="#">田园</a>
<a href="#">地中海</a>
<a href="#">现代</a>
<a href="#">混搭</a>
</div>
</li>
</ul>
</li>
<li class="item">
<h2>工装设计</h2>
<div class="des-column-link">
<a href="#" class="des-red">餐厅设计</a>
<a href="#" class="des-red">休闲会所</a>
<a href="#">办公室设计</a>
<a href="#" class="des-red">主题酒店</a>
<a href="#">娱乐空间</a>
<a href="#">商业展示</a>
<a href="#" class="des-red">购物中心</a>
<a href="#">教育机构</a>
<a href="#" class="des-red">医疗机构</a>
</div>
<ul class="product-wrap product-wrap002">
<li>
<h2>类型</h2>
<div class="des-column-link">
<a href="#">酒店空间</a>
<a href="#">购物空间</a>
<a href="#">文化空间</a>
<a href="#">商业展示</a>
<a href="#">医疗机构</a>
<a href="#">办公空间</a>
<a href="#">餐饮空间</a>
<a href="#">娱乐空间</a>
<a href="#">休闲场所</a>
<a href="#">售楼中心</a>
<a href="#">金融机构</a>
<a href="#">运动场所</a>
<a href="#">教育机构</a>
</div>
</li>
</ul>
</li>
<li class="item item-clear">
<h2>室内设计师</h2>
<div class="des-column-link">
<a href="#" class="des-red">设计本网站在线交易流程及服务保障>>></a>
<a href="#" class="des-red">北京</a>
<a href="#">上海</a>
<a href="#" class="des-red">深圳</a>
<a href="#">台湾</a>
<a href="#">别墅</a>
<a href="#" class="des-red">会所</a>
<a href="#">酒店</a>
<a href="#" class="des-red">餐厅</a>
<a href="#" class="des-red">办公室</a>
</div>
<ul class="product-wrap product-wrap003">
<li>
<h2>所在城市</h2>
<div class="des-column-link">
<a href="#">北京</a>
<a href="#">上海</a>
<a href="#">广州</a>
<a href="#">深圳</a>
<a href="#">南京</a>
<a href="#">天津</a>
<a href="#">杭州</a>
<a href="#">武汉</a>
<a href="#">成都</a>
<a href="#">西安</a>
<a href="#">福州</a>
<a href="#">苏州</a>
<a href="#">郑州</a>
<a href="#">合肥</a>
<a href="#">贵阳</a>
<a href="#">宁波</a>
<a href="#">长沙</a>
</div>
</li>
<li>
<h2>擅长空间</h2>
<div class="des-column-link">
<a href="#">家居住宅</a>
<a href="#">别墅豪宅</a>
<a href="#">办公室</a>
<a href="#">酒店</a>
<a href="#">餐厅</a>
<a href="#">咖啡厅</a>
<a href="#">酒吧</a>
<a href="#">KTV</a>
<a href="#">商业展示</a>
<a href="#">医院</a>
<a href="#">幼儿园</a>
<a href="#">会所</a>
<a href="#">样板房</a>
<a href="#">售楼处</a>
<a href="#">文化空间</a>
<a href="#">运动空间</a>
</div>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="des-banners">
<div class="hd des-banners-circle">
<ul>
<li class="on"></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<div class="bd des-banners-image">
<ul>
<li class="des-banners-image-001">
<a href="#"></a>
</li>
<li class="des-banners-image-002">
<a href="#"></a>
</li>
<li class="des-banners-image-003">
<a href="#"></a>
</li>
<li class="des-banners-image-004">
<a href="#"></a>
</li>
<li class="des-banners-image-005">
<a href="#"></a>
</li>
</ul>
</div>
</div>
<script type="text/javascript">
$(function(){//左侧二级菜单
$('.des-column-head .item').hover(function(){
$(this).addClass('active').find('s').hide();
$(this).find('.product-wrap').show();
},function(){
$(this).removeClass('active').find('s').show();
$(this).find('.product-wrap').hide();
});
});
jQuery(".des-banners").slide({//首页轮播
mainCell: ".bd ul",
effect: "leftLoop",
autoPlay: true,
trigger: "click",
delayTime: 700
});
jQuery(".des-menu-nav").slide({//导航二级菜单
type: "menu",
titCell: "dd",
targetCell: "ul",
delayTime: 0,
defaultPlay: false,
returnDefault: true
});
</script>
文件目录
本资源来自：代码 » 导航菜单 » jquery室内设计网站导航和图片滚动布局代码
注：此资源非帝国CMS模板/特效/源码，需要帝国CMS整站模板源码的小伙伴，请移步 帝国CMS模板，感谢支持！
jquery顶部固定导航二级下拉菜单代码
« 上一篇
2018年06月25日
jQuery仿新浪顶部导航下拉菜单代码
下一篇 »
2018年06月09日
1、如非特殊说明，本站对本文提供的代码或者素材不拥有任何权利，其版权归原著者拥有。
2、以上提供的代码或者素材均为作者提供和网友推荐收集整理而来，仅供学习和研究使用。
3、如有侵犯你版权的，请来信（邮箱:48444431@qq.com）指出，核实后，本站将立即改正。
4、如有链接无法下载、失效或广告，请点击下面的报错或者联系墨鱼处理！
5、以上资源售价只是赞助，不代表代码或者素材本身价格。收取费用仅维持本站的服务器开销！
6、如无特殊说明，如：织梦或者帝国等开源CMS核心模板，那么默认提供的只是HTML模板！
7、所有代码素材效果均为演示打包，最终效果请参考演示效果，本站不提供任何技术支持和服务。
8、代码素材均为虚拟物品，演示和描述无错的情况下，无法进行退换服务。
2、以上提供的代码或者素材均为作者提供和网友推荐收集整理而来，仅供学习和研究使用。
3、如有侵犯你版权的，请来信（邮箱:48444431@qq.com）指出，核实后，本站将立即改正。
4、如有链接无法下载、失效或广告，请点击下面的报错或者联系墨鱼处理！
5、以上资源售价只是赞助，不代表代码或者素材本身价格。收取费用仅维持本站的服务器开销！
6、如无特殊说明，如：织梦或者帝国等开源CMS核心模板，那么默认提供的只是HTML模板！
7、所有代码素材效果均为演示打包，最终效果请参考演示效果，本站不提供任何技术支持和服务。
8、代码素材均为虚拟物品，演示和描述无错的情况下，无法进行退换服务。
