QQ客服
当前位置 : 首页 > 代码 > 网页特效 > 导航菜单 > jquery室内设计网站导航和图片滚动布局代码

原创商用 jquery室内设计网站导航和图片滚动布局代码

jquery 实现左右轮播滚动以及左侧导航菜单效果布局,基于superslide开发,jquery均有注释,参数可修改,下载即可使用。
分享到微信朋友圈
X
[声明]该素材是本站付费买断的作品代码,享受著作权?;?,未经允许请勿转载,否则追究相应的法律责任。

使用方法:

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>
[声明]本站素材来自用户分享,仅限学习交流请勿用于商业用途。如损害你的权益请联系客服QQ:2447402004给予处理。
举报×
举报原因:

相关代码

二维码
意见反馈
×
×

注册

QQ注册 立即下载 新浪注册 立即下载

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了
澳门足彩 www.r69.net-彩票每天有多少人买| www.525079.com-乐8彩时时彩| www.645210.com-网上彩票的心得体会| www.749660.com-红财神报彩图网址| www.839586.com-快三怎么查-| www.924968.com-豹赢彩票骗局| 华为彩票www.hw8877.com| www.gg71.com-大发快三是合法的吗| www.e79.com-特区七星彩头尾论坛| www.62aj.com-足彩胜负彩310| www.2247.xyz-大彩网是正规网站吗| www.08199.cc-竞彩足球胜平负规则| www.514789.com-湖南福彩电子报| www.646433.com-足彩神器-| www.970604.com-深圳彩票中奖| www.ms6.com-吉林快三直播开奖| www.b99.cc-网投时时彩骗局揭秘| www.154265.com-梦见选彩票数字| www.230709.com-6234彩票app| www.307508.com-韩国有快三吗| www.379243.com-潢川彩票中奖| www.983904.com-3d福彩下载安装| www.0tq.com-彩票中心主任贪污| www.367769.com-七星彩番外馒头| www.499578.com-韩国彩票3d-| www.118199.com-浙江体彩6十1查询| www.41la.com-鸿运彩票平台违法吗| www.1805.me-三位数体彩中奖| www.045.net-1396彩库宝典| www.35um.com-彩票查询七星彩图规| www.1655.in-足彩吧公平赔率| www.233750.com-福彩3d2000期| www.29816.cc-福彩中奖情况| www.577875.com-甘肃福彩快3彩票| www.2740.xyz-赢钱彩票下载安装| www.964713.com-一分时时彩开奖器| www.030379.com-淘彩票购彩大厅| www.95195.com-彩票公益金资助标签| www.153.vip-彩虹天堂歌曲| www.660854.com-陕西体彩11选| www.009193.com-河南七星彩兑奖期限| www.344968.com-天天彩票乐天棋牌| www.576143.com-体彩18048期| 福利彩票www.99677k.com| www.lr03.com-三d彩票开奖| www.62ml.com-乐彩网排三技巧| www.2005.vip-体彩开奖结果任九| www.799099.com-福彩中心代销| www.680961.com-购彩2app-| www.858439.com-时时彩一赔多少| www.58719.com-中国彩吧第一版| www.24757.com-怎么用彩铅画画| www.989752.com-怎么下载乐彩网| 辉煌彩票www.2875i.com| www.128488.com-大乐透的中奖彩票| www.s67.xyz-网上购买彩票的软件| www.15077.cc-彩报3d图库三毛| www.62343.com-今晚七彩星开奖结果| www.042882.com-福利彩票32期开奖| www.170141.com-江西快三常规走势图| www.282328.com-台湾时时彩开奖记录| www.356767.com-网易彩票合法| www.uo69.com-内蒙体育彩票活动| www.29oj.com-体彩开奖号码昨天| www.40561.com-掌优彩票合法吗| 五彩堂www.wct3.com| www.562319.com-福彩3d交流群号| www.803699.com-体彩排列三杀号三哥| www.2350.cn-福彩快乐5分| www.421611.com-广西中彩票去哪里领| www.771878.com-大通彩票下载安装| www.932408.com-时时彩必出规律| www.990364.com-王彩票-| www.rw3.com-正规十大搏彩网站| www.34252.com-吉林快三号码分布图| www.fo49.com-e球彩进球数规律| www.237534.com-云发购彩票是什么| www.787472.com-360彩票篮球| www.547826.com-万彩影像大师破解| www.90ai.cc-电竞博彩能玩吗| www.00402.com-彩票中600万| www.55348.cc-大发快三网页| www.766585.com-彩票计划群倍投| www.893973.com-九九集团app彩票| www.984407.com-神童免费资料中彩网| www.xu7.com-上海快三软件下载| www.026754.com-京彩彩票是真的吗| www.858777.com-3g彩票网-| www.721669.com-破译彩票软件| 计划网--杏彩代理-| www.556357.com-103亿彩票-| www.641060.cc-体育彩票广告标志| www.773812.com-国外搞时时彩犯法吗| www.862407.com-彩票书籍在线閲读| www.952299.com-马来3分彩开奖网站| www.fs11.com-快三对几个号中奖| www.51400.cc-可乐彩票app| www.025576.com-内蒙福彩电话号码| www.zx4.com-彩票开奖网-| www.789785.com-香蕉计划竞彩理财| www.880290.com-呼市福利彩票| www.953934.com-牛蛙彩票现场直播| www.cp3929.com-河南快三彩票走势图| www.pk08.com-三d彩票高手经验| www.x94.xyz-彩八仙计划软件| www.205589.com-周易测快三-| www.548585.com-广州彩票12生肖| www.6686.live-彩票应用何种定律| www.429942.com-创意色彩作品| www.637763.com-上海福彩一等奖| www.171822.com-一分快三-| www.288302.com-彩票九宫图怎么用| www.194601.com-e球彩开奖结果| www.56732.cc-幸运娱乐彩票| www.g88.top-足球彩票预测app| www.125969.com-卖彩票赚钱吗| www.209441.com-大发快三正规的平台| 彩神网www.csw288.com| www.vf25.com-买体彩要身份证吗| www.159.red-关于彩虹的名称| www.261871.com-玩快三输了12万| www.860177.com-时时中彩票下載| www.579569.com-送钱的彩票软件| www.657049.com-福利彩票二维码| www.958109.com-鸿运五分彩开奖软件| 购彩在线www.66332d.com| www.71fy.com-时时彩牛牛稳赚| www.39829.cc-江苏快三专家预测网| www.667138.com-今日体彩排列五预测| www.220093.com-内蒙古快三质合| www.737477.com-新彩吧手机网| www.875443.com-下菜彩票-| www.971201.com-球探彩票ios| www.hn12.com-上海时时彩开奖记录| www.95gg.com-kk彩票靠谱-| www.20qz.com-体彩2月16号开奖| www.91up.cc-玖富彩票平台怎么样| www.62580.com-360彩票篮球| www.288255.com-江苏快三爱彩乐推荐| www.3305.org-中彩吧2020下载| www.958606.com-今天开七彩-| www.691776.com-足球14场彩票| www.818048.com-九星彩票可以玩吗| www.929267.com-安徽福彩网上缴费| www.974132.com-双色球杀号定胆唯彩| www.np46.com-彩票中奖生成器| www.675347.com-今天体彩开奖| www.746817.com-彩票优惠活动| www.807327.com-姜山冷门唯彩会| www.871100.com-彩票投注计算软件| www.925229.com-快三门户网怎么样| www.974728.com-中奖彩票新闻| 大赢家彩票平台www.316106.com| www.mk81.com-凤凰时时彩官方| www.885087.com-玩彩票最忌讳什么| www.968482.com-中国彩票作弊| www.cp5768.com-买快三输的最惨的人| www.030525.com-高频彩联盟官网| www.7565.xyz-22彩票软件苹果版| www.91455.com-日本加税好彩| www.035686.com-红彩会555-| www.089610.com-重庆时时彩必输原理| www.177996.com-快三中奖宝典| www.246292.com-竞彩足球比分推荐网|