jQuery商品展示下单选购特效代码下载

jQuery商品展示下单选购特效代码下载

1. 引入CSS

<link rel="stylesheet" href="css/shouye.css">

2. 引入JS

<script src="js/jquery-1.8.3.min.js"></script>
<script   src="js/modernizr-custom-v2.7.1.min.js"></script>

3. HTML代码

<div class="Xcontent">
	<ul class="Xcontent01">
		<div class="Xcontent06"><img src="images/shangpinxiangqing/X1.png"></div>
		<ol class="Xcontent08">
			<div class="Xcontent07"><img src="images/shangpinxiangqing/X1.png"></div>
			<div class="Xcontent09"><img src="images/shangpinxiangqing/X7.png"></div>
			<div class="Xcontent10"><img src="images/shangpinxiangqing/X8.png"></div>
			<div class="Xcontent11"><img src="images/shangpinxiangqing/X9.png"></div>
			<div class="Xcontent12"><img src="images/shangpinxiangqing/X10.png"></div>
		</ol>
		<ol class="Xcontent13">
			<div class="Xcontent14"><a href="#"><p>新物品</p></a></div>
			<div class="Xcontent15"><img src="images/shangpinxiangqing/X11.png"></div>
			<div class="Xcontent16"><p>充电5分钟,温暖2小时</p></div>
			<div class="Xcontent17">
				<p class="Xcontent18">售价</p>
				<p class="Xcontent19">¥<span>69.00</span></p>
				<div class="Xcontent20">
					<p class="Xcontent21">促销</p>
					<img src="images/shangpinxiangqing/X12.png">
					<p class="Xcontent22">领610元新年礼券,满再赠好礼</p>
				</div>
				<div class="Xcontent23">
					<p class="Xcontent24">服务</p>
					<p class="Xcontent25">30天无忧退货&nbsp;&nbsp;&nbsp;&nbsp;       48小时快速退款 &nbsp;&nbsp;&nbsp;&nbsp;        满88元免邮</p>
				</div>
			</div>
			<div class="Xcontent26">
				<p class="Xcontent27">颜色</p>
				<div class="Xcontent28"><img  src="images/shangpinxiangqing/X14.png"></div>
					<div class="Xcontent29"><img  src="images/shangpinxiangqing/X1.png"></div>
			</div>
			<div class="Xcontent30">
				<p class="Xcontent31">数量</p>
				<div class="Xcontent32"><img src="images/shangpinxiangqing/X15.png"></div>
				<form><input class="input" value="1"></form>
				<div class="Xcontent33"><img src="images/shangpinxiangqing/16.png"></div>
			</div>
			<div class="Xcontent34"><a href="#"><img src="images/shangpinxiangqing/X17.png"></a></div>
			<div class="Xcontent35"><a href="#"><img src="images/shangpinxiangqing/X18.png"></a></div>
		</ol>
	</ul>
</div>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>

用户评论

18素材网

一个让开发更高效的素材分享平台,用于快速开发强大的Web界面。


官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:864918708
Css3+Html5讨论群
群号:864918708

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