android 购物车抛物线,javascript写出各大商城网站的购物车抛物线效果

*{margin:0;padding:0;}

.banner{width:100%;height:160px;background:url("images/banner.jpg") center top;}

.par_list{width:990px;height:310px;margin:40px auto;}

.par_list ul li{width:220px;height:300px;border:1px solid #ddd;list-style-type:none;

float:left;margin:0 7px;padding:5px;

}

.par_list ul li p.title{color:#666;font-size:12px;line-height:40px;}

.par_list ul li p.jg{color:red;}

.par_list ul li p.jg span{float:right;width:80px;height:30px;background:red;color:#fff;

line-height:30px;font-size:12px;text-align:center;

border-radius:5px;

}

.carbox{width:260px;height:100%;background:green;position:fixed;

top:0;right:-220px;

}

.carbox .left{width:40px;height:100%;background:#000;position:relative;

float:left;

}

.carbox .left span{color:#fff;font-size:12px;width:12px;display:block;background:red;

padding:10px 14px;position:absolute;top:50%;left:0;margin-top:-42px;

}

.carbox .con{width:220px;height:100%;background:#ddd;float:left;}

.carbox .con dl{width:200px;height:60px;border-bottom:1px solid #fff;padding:10px;}

.carbox .con dl dt{width:60px;height:60px;float:left;}

.carbox .con dl dd{width:120px;float:right;font-size:12px;line-height:20px;margin-right:10px;}