利用jquery实现立式陈列柜滑块查看全图点击预览



38 149 50



特效描述:利用jquery实现 立式陈列柜滑块 查看全图 点击预览,利用jquery实现立式陈列柜滑块查看全图点击预览

代码结构

1. 引入CSS

<link rel="stylesheet" type="text/css" href="css/style.css" />
<link href='css/css.css' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/noscript.css" />
<link rel="stylesheet" type="text/css" href="css/noscript.css" />

2. 引入JS

<script type="text/javascript" src="js/modernizr.custom.79639.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/slider.js"></script>

3. HTML代码

		<section id="ps-container" class="ps-container">
			<div class="ps-header">
			</div><!-- /ps-header -->
			<div class="ps-contentwrapper">
				<div class="ps-content">
					<h2>Bernhard</h2>
					<span class="ps-price">&pound;100</span>
					<p>With restful springiness in the seat; prevents static sitting and provides enhanced seating comfort. Padded seat and back for enhanced seating comfort. Soft, hardwearing and easy care leather, which ages gracefully.</p>
					<a href="http://51qianduan.com/">Buy this item</a>
				</div>
				<div class="ps-content">
					<h2>Tobias</h2>
					<span class="ps-price">&pound;65</span>
					<p>For increased stability, re-tighten the screws about two weeks after assembly. Seat and back with restful flexibility; prevents a static sitting posture and enhances comfort.</p>
					<a href="http://51qianduan.com/">Buy this item</a>
				</div>
				<div class="ps-content">
					<h2>P&ouml;ang</h2>
					<span class="ps-price">&pound;140</span>
					<p>Frame made of layer-glued bent birch; a very strong and durable material. High back provides great support for your neck. Sheepskin has natural insulating properties, which make it feel warm and cosy to sit on. Extra cushions are available for variation and renewal.</p>
					<a href="http://51qianduan.com/">Buy this item</a>
				</div>
				<div class="ps-content">
					<h2>Mellby</h2>
					<span class="ps-price">&pound;195</span>
					<p>Easy to keep clean; removable, machine washable cover. Seat cushion with a top layer of memory foam; moulds to the precise contours of your body and regains its shape when you get up.</p>
					<a href="http://51qianduan.com/">Buy this item</a>
				</div>
				<div class="ps-content">
					<h2>Torbj&ouml;rn</h2>
					<span class="ps-price">&pound;30</span>
					<p>Height adjustable for a comfortable sitting posture. The sloping seat gives a comfortable sitting position when leaning forwards.</p>
					<a href="http://51qianduan.com/">Buy this item</a>
				</div>
			</div><!-- /ps-contentwrapper -->
			<div class="ps-slidewrapper">
				<div class="ps-slides">
					<div style="background-image:url(images/1.jpg);"></div>
					<div style="background-image:url(images/2.jpg);"></div>
					<div style="background-image:url(images/3.jpg);"></div>
					<div style="background-image:url(images/4.jpg);"></div>
					<div style="background-image:url(images/5.jpg);"></div>
				</div>
				<nav>
					<a href="#" class="ps-prev" ></a>
					<a href="#" class="ps-next" ></a>
				</nav>
			</div><!-- /ps-slidewrapper -->
		</section><!-- /ps-container -->
		<!-- jQuery if needed -->
		<script type="text/javascript">
			$(function() {
				Slider.init();
			});
</script>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 滑动导航菜单 滑动选项卡切换 图片滑动 文字滑动 滑动手风琴 滑动星星打分 滑动滑过

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到