Html
    Css
    Js

    
                        
@charset "utf-8";
	/* CSS Document */
html,body,div,span,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,address,big,cite,code,del,em,font,img,ins,small,strong,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend {
	margin:0;
	padding:0;
}
body {
	background:#FFFFFF;
	color:#333333;
	font-family:"宋体",Arial,Lucida,Verdana,Helvetica,sans-serif;
	font-size:12px;
	line-height:150%;
}
a:link,a:visited {
	color:#333333;
	text-decoration:none;
}
a:hover {
	color:#CC0000;
	text-decoration:underline;
}
a:active {
	color:#990000;
}
ol,ul {
	list-style:none outside none;
}
.m {
	margin-bottom:10px;
}
.m,.mt,.mc,.mb {
	overflow:hidden;
}
/* Clear Fix */ 
.clearfix:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
.clearfix {
	display:inline-block;
}
/* Hide from IE Mac */ 
.clearfix {
	display:block;
}
/* End hide from IE Mac */ 
/* end of clearfix */ 
/*页面全局结束*/
.tab {
	overflow:hidden;
}
.tab li,.tab a,.tab-item {
	cursor:pointer;
	float:left;
	text-align:center;
}
.m,.mt,.mc,.mb {
	overflow:hidden;
}
.mt .extra {
	float:right;
}
.right-extra .mt {
	height:28px;
	line-height:28px;
	padding:0 10px 8px;
	border-top:1px solid #EED97C;
	background:url(../images/bg_hotsale.gif) repeat-x 0 -552px;
	color:#c00;
}
.right-extra .tab {
	border-bottom:2px solid #BE0000;
	margin-bottom:10px;
}
.right-extra .tab li {
	position:relative;
	height:24px;
	padding:3px 12px 0;
	background:url(../images/icon_clubs.gif) #ccc no-repeat right -150px;
	overflow:hidden;
	margin-right:3px;
	line-height:24px;
	font-size:14px;
	font-weight:bold;
	color:#c30;
}
.right-extra .tab span {
	position:absolute;
	left:0;
	top:0;
	z-index:1;
	width:10px;
	height:27px;
	background:url(../images/icon_clubs.gif) no-repeat 0 -150px;
}
.right-extra .tab a {
	float:none;
	color:#c30;
}
.right-extra .tab .curr {
	background-position:right -178px;
	color:#fff;
}
.right-extra .tab .curr span {
	background-position:0 -178px;
}
.right-extra .tab .curr a {
	color:#fff;
}
.right-extra .mc .extra {
	padding:5px 10px;
	border-top:1px solid #F3E6C6;
}
.right-extra .total {
	float:right;
}
.right-extra .total strong {
	color:#FF7403;
}
.right-extra .total a:link,.right-extra .total a:visited {
	color:#005aa0;
}
.right-extra .join a:link,.right-extra .join a:visited {
	color:#FF7604;
}
.right-extra .norecode {
	padding:0 10px 10px;
}
.right-extra .iloading {
	margin-bottom:10px;
}
/*评论列表*/
#comment .item {
	border:1px solid #FFFFFF;
	padding:8px 15px;
}
#comment .odd {
	background:none repeat scroll 0 0 #F4F9FF;
	border:1px solid #EDF0F1;
	border-radius:10px 10px 10px 10px;
}
#comment .user {
	color:#999999;
	text-align:right;
}
#comment .user span {
	margin-left:20px;
}
#comment .user .u-level {
	color:#088100;
}
#comment dl {
	margin-bottom:5px;
	overflow:hidden;
}
#comment dt {
	float:left;
	text-align:right;
	width:80px;
}
#comment dd {
	float:right;
	overflow:hidden;
	width:649px;
}
#comment .content {
	float:left;
	width:510px;
}
#comment .date-answer {
	color:#999999;
	float:right;
	text-align:right;
	width:130px;
}
#comment .useful {
	color:#999999;
	text-align:right;
}
#comment .useful a {
	color:#005AA0;
}
#comment dt b {
	background-image:url("../images/icon_clubs.gif");
	background-repeat:no-repeat;
	float:left;
	height:13px;
	margin:2px 3px 0 0;
	width:14px;
}
#comment .ask b {
	background-position:-72px -14px;
}
#comment .answer {
	color:#D75509;
}
#comment .answer b {
	background-position:-57px -14px;
}
/*图片放大镜样式*/
.jqzoom {
	float:left;
	border:none;
	position:relative;
	padding:0px;
	cursor:pointer;
	margin:0px;
	display:block;
}
.zoomdiv {
	z-index:100;
	position:absolute;
	top:0px;
	left:0px;
	width:350px;
	height:350px;
	background:#ffffff;
	border:1px solid #CCCCCC;
	display:none;
	text-align:center;
	overflow:hidden;
}
.jqZoomPup {
	z-index:10;
	visibility:hidden;
	position:absolute;
	top:0px;
	left:0px;
	width:20px;
	height:20px;
	border:1px solid #aaa;
	background:#ffffff /*url(../images/zoom.png) 50% center no-repeat*/;
	opacity:0.5;
	-moz-opacity:0.5;
	-khtml-opacity:0.5;
	filter:alpha(Opacity=50);
}
/*图片小图预览列表*/
.spec-preview {
	width:350px;
	height:350px;
	border:1px solid #DFDFDF;
}
.spec-scroll {
	clear:both;
	margin-top:5px;
	width:352px;
}
.spec-scroll .prev {
	float:left;
	margin-right:4px;
}
.spec-scroll .next {
	float:right;
}
.spec-scroll .prev,.spec-scroll .next {
	display:block;
	font-family:"宋体";
	text-align:center;
	width:10px;
	height:54px;
	line-height:54px;
	border:1px solid #CCC;
	background:#EBEBEB;
	cursor:pointer;
	text-decoration:none;
}
.spec-scroll .items {
	float:left;
	position:relative;
	width:322px;
	height:56px;
	overflow:hidden;
}
.spec-scroll .items ul {
	position:absolute;
	width:999999px;
	height:56px;
}
.spec-scroll .items ul li {
	float:left;
	width:64px;
	text-align:center;
}
.spec-scroll .items ul li img {
	border:1px solid #CCC;
	padding:2px;
	width:50px;
	height:50px;
}
.spec-scroll .items ul li img:hover {
	border:2px solid #FF6600;
	padding:1px;
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

产品详情页图片放大效果

1
      jinit0
      2017/12/20 15:38:15

      脚本写点行吗??

      回复