<!doctype html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>购物网站加入购物车产品展示代码</title>
<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/default.css">
<link href='http://fonts.useso.com/css?family=Open+Sans:400,600,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/styles.css">
<!--[if IE]>
<script src="http://libs.useso.com/js/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div id="wrapper">
<div class="cart-icon-top">
</div>
<div class="cart-icon-bottom">
</div>
<div id="checkout">
CHECKOUT
</div>
<div id="info">
<p>适用浏览器：360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。</p>
</div>
<div id="header">
<ul>
<li><a href="">Home</a></li>
<li><a href="">BRANDS</a></li>
<li><a href="">DESIGNERS</a></li>
<li><a href="">CONTACT</a></li>
</ul>
</div>
<div id="sidebar">
<h3>CART</h3>
<div id="cart">
<span class="empty">No items in cart.</span>
</div>
<h3>CATEGORIES</h3>
<div class="checklist categories">
<ul>
<li><a href=""><span></span>New Arivals</a></li>
<li><a href=""><span></span>Accesories</a></li>
<li><a href=""><span></span>Bags</a></li>
<li><a href=""><span></span>Dressed</a></li>
<li><a href=""><span></span>Jackets</a></li>
<li><a href=""><span></span>jewelry</a></li>
<li><a href=""><span></span>Shoes</a></li>
<li><a href=""><span></span>Shirts</a></li>
<li><a href=""><span></span>Sweaters</a></li>
<li><a href=""><span></span>T-shirts</a></li>
</ul>
</div>
<h3>COLORS</h3>
<div class="checklist colors">
<ul>
<li><a href=""><span></span>Beige</a></li>
<li><a href=""><span style="background:#222"></span>Black</a></li>
<li><a href=""><span style="background:#6e8cd5"></span>Blue</a></li>
<li><a href=""><span style="background:#f56060"></span>Brown</a></li>
<li><a href=""><span style="background:#44c28d"></span>Green</a></li>
</ul>
<ul>
<li><a href=""><span style="background:#999"></span>Grey</a></li>
<li><a href=""><span style="background:#f79858"></span>Orange</a></li>
<li><a href=""><span style="background:#b27ef8"></span>Purple</a></li>
<li><a href=""><span style="background:#f56060"></span>Red</a></li>
<li><a href=""><span style="background:#fff;border: 1px solid #e8e9eb;width:13px;height:13px;"></span>White</a></li>
</ul>
</div>
<h3>SIZES</h3>
<div class="checklist sizes">
<ul>
<li><a href=""><span></span>XS</a></li>
<li><a href=""><span></span>S</a></li>
<li><a href=""><span></span>M</a></li>
</ul>
<ul>
<li><a href=""><span></span>L</a></li>
<li><a href=""><span></span>XL</a></li>
<li><a href=""><span></span>XXL</a></li>
</ul>
</div>
<h3>PRICE RANGE</h3>
<img src="img/price-range.png" alt="" />
</div>
<div id="grid-selector">
<div id="grid-menu">
View:
<ul>
<li class="largeGrid"><a href=""></a></li>
<li class="smallGrid"><a class="active" href=""></a></li>
</ul>
</div>
Showing 1–9 of 48 results
</div>
<div id="grid">
<div class="product">
<div class="info-large">
<h4>FLUTED HEM DRESS</h4>
<div class="sku">
PRODUCT SKU: <strong>89356</strong>
</div>
<div class="price-big">
<span>$43</span> $39
</div>
<h3>COLORS</h3>
<div class="colors-large">
<ul>
<li><a href="" style="background:#222"><span></span></a></li>
<li><a href="" style="background:#6e8cd5"><span></span></a></li>
<li><a href="" style="background:#f56060"><span></span></a></li>
<li><a href="" style="background:#44c28d"><span></span></a></li>
</ul>
</div>
<h3>SIZE</h3>
<div class="sizes-large">
<span>XS</span>
<span>S</span>
<span>M</span>
<span>L</span>
<span>XL</span>
<span>XXL</span>
</div>
<button class="add-cart-large">Add To Cart</button>
</div>
<div class="make3D">
<div class="product-front">
<div class="shadow"></div>
<img src="img/1.jpg" alt="" />
<div class="image_overlay"></div>
<div class="add_to_cart">Add to cart</div>
<div class="view_gallery">View gallery</div>
<div class="stats">
<div class="stats-container">
<span class="product_price">$39</span>
<span class="product_name">FLUTED HEM DRESS</span>
<p>Summer dress</p>
<div class="product-options">
<strong>SIZES</strong>
<span>XS, S, M, L, XL, XXL</span>
<strong>COLORS</strong>
<div class="colors">
<div class="c-blue"><span></span></div>
<div class="c-red"><span></span></div>
<div class="c-white"><span></span></div>
<div class="c-green"><span></span></div>
</div>
</div>
</div>
</div>
</div>
<div class="product-back">
<div class="shadow"></div>
<div class="carousel">
<ul class="carousel-container">
<li><img src="img/1.jpg" alt="" /></li>
<li><img src="img/2.jpg" alt="" /></li>
<li><img src="img/3.jpg" alt="" /></li>
</ul>
<div class="arrows-perspective">
<div class="carouselPrev">
<div class="y"></div>
<div class="x"></div>
</div>
<div class="carouselNext">
<div class="y"></div>
<div class="x"></div>
</div>
</div>
</div>
<div class="flip-back">
<div class="cy"></div>
<div class="cx"></div>
</div>
</div>
</div>
</div>
<div class="product">
<div class="info-large">
<h4>PLEAT PRINTED DRESS</h4>
<div class="sku">
PRODUCT SKU: <strong>89356</strong>
</div>
<div class="price-big">
<span>$43</span> $39
</div>
jquery实现的购物网站加入购物车产品展示效果源码.zip
版权申诉
140 浏览量
2022-11-07
00:24:26
上传
评论
收藏 225KB ZIP 举报
jquery实现的购物网站加入购物车产品展示效果源码.zip （23个子文件） 
132686884739482400 css 
default.css 6KB styles.css 22KB img 
8.jpg 28KB
header-icons.png 2KB 2.jpg 27KB 1.jpg 32KB 6.jpg 29KB 3.jpg 27KB 5.jpg 26KB delete-item.png 1KB grid-menu.png 1KB 4.jpg 28KB cart.png 1KB 7.jpg 33KB price-range.png 3KB fonts icomoon.woff 1KB
icomoon.svg 2KB icomoon.eot 2KB icomoon.ttf 1KB
index.html 33KB js main.js 10KB stopExecutionOnTimeout.js 2KB jquery-2.1.1.min.js 82KB资源评论
