multiSelect+Echarts_echarts multiselect 例子-CSDN博客

本文链接：https://blog.csdn.net/u014771464/article/details/79982115

index.jsp

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<title>统计报表</title>
<link rel="stylesheet" type="text/css" href="style/list.css"/>
<link rel="stylesheet" type="text/css" href="style/manhuaDate.1.0.css"/>

<script type="text/javascript" src="js/date.js"></script>
<script type="text/javascript" src="js/ui.tab.js"></script>
<script src="js/echarts.js"></script>
<script src="js/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var tab = new $.fn.tab({
tabList:"#demo1 .ui-tab-container .ui-tab-list li",
contentList:"#demo1 .ui-tab-container .ui-tab-content"
});
var tab = new $.fn.tab({
tabList:"#demo1 .ui-tab-container .ui-tab-list2 li",
contentList:"#demo1 .ui-tab-container .ui-tab-content2"
});
});
</script>
<script type="text/javascript">
$(function (){
$("input.mh_date").datejs({
Event : "click",//可选
Left : 0,//弹出时间停靠的左边位置
Top : -16,//弹出时间停靠的顶部边位置
fuhao : "-",//日期连接符默认为-
isTime : false,//是否开启时间值默认为false
beginY : 2010,//年份的开始默认为1949
endY :2015//年份的结束默认为2049
});
});
</script>
<script type="text/javascript">
$(document).ready(function(e) {
$("#selectList").find(".more").toggle(function(){
$(this).addClass("more_bg");
$(".more-none").show()
},function(){
$(this).removeClass("more_bg");
$(".more-none").hide()
});
});
</script>
<script type="text/javascript">
$(document).ready(function(){
var taboy_box=$(".lefttable-list");
taboy_box.children("tbody").find("tr:gt(2)").hide();
$(".leftbox-morea").toggle(function(){
$(this).parent().prev().find("tr").show();
$(this).addClass("more-i")
},function(){
$(this).removeClass("more-i");
$(this).parent().prev().children("tbody").find("tr:gt(2)").hide();
}
);
});
</script>
</head>

<body>

<div class="w1200">
<div class="list-screen">
<div class="screen-top" style="position:relative;"><span>查询<input id="txtadress" type="text"/></span><a href="#" id="submit-btn"/>搜索</a></div>
<div class="screen-term">
<div class="selectNumberScreen">
<div id="selectList" class="screenBox screenBackground">
<dl class="listIndex" attr="价格范围">
<dt>时间范围</dt>
<dd>
<label><a href="javascript:;" values2="" values1="" attrval="不限">不限</a></label>
<label>
<input name="radio2" type="radio" value="" />
<a href="javascript:;" values2="99" values1="1" attrval="1-99">本周</a></label>
<label>
<input name="radio2" type="radio" value="" />
<a href="javascript:;" values2="300" values1="100" attrval="100-300">本月</a></label>
<label>
<input name="radio2" type="radio" value="" />
<a href="javascript:;" values2="600" values1="300" attrval="300-600">本季度</a></label>
<label>
<input name="radio2" type="radio" value="" />
<a href="javascript:;" values2="1500" values1="600" attrval="5000以上">本年</a></label>
<div class="custom"><span>自定义</span> 
<input name="" class="mh_date" type="text" id="custext1"/>
 - 
<input name="" class="mh_date" type="text" id="custext2"/>
<input name="" type="button" id="cusbtn"/>
</div>
</dd>
</dl>
<dl class="listIndex" attr="terminal_brand_s">
<dt>用户</dt>
<dd data-more=true>
<label><a href="javascript:;" values2="" values1="" attrval="不限">不限</a></label>
<label>
<input name="checkbox2" type="checkbox" value="" autocomplete="off"/>
<a href="javascript:;" values2="" values1="" attrval="小米">客栈</a></label>
<label>
<input name="checkbox2" type="checkbox" value="" autocomplete="off"/>
<a href="javascript:;" values2="" values1="" attrval="华为">精品酒店</a> </label>
<label>
<input name="checkbox2" type="checkbox" value="" autocomplete="off"/>
<a href="javascript:;" values2="" values1="" attrval="lenovo">情侣酒店</a> </label>
<label>
<input name="checkbox2" type="checkbox" value="" autocomplete="off"/>
<a href="javascript:;" values2="" values1="" attrval="zte中兴">园林庭院</a></label>
<span class="more"><em class="open"></em>更多</span>
</dd>
</dl>
<dl class="listIndex more-none" attr="terminal_brand_s" style="display:none;border:none">
<dt style='visibility:hidden'>主题风格</dt>
<dd >
<label style='visibility:hidden'><a href="javascript:;" values2="" values1="" attrval="不限">不限</a></label>
<form action="" method="get">
<label><input name="checkbox2" type="checkbox" value="" /><a href="javascript:;" values2="" values1="" attrval="华为">精品酒店2</a></label>
<label><input name="checkbox2" type="checkbox" value="" /><a href="javascript:;" values2="" values1="" attrval="华为">精品酒店3</a> </label>
<label><input name="checkbox2" type="checkbox" value="" /><a href="javascript:;" values2="" values1="" attrval="华为">精品酒店4</a> </label>
</form>
</dl>
</div>
</div>
</div>

</div>

<div class="hasBeenSelected clearfix"><span id="time-num"><font>N</font>个类似查询</span>
<div style="float:right;" class="eliminateCriteria">【清空全部】 </div>
<dl>
<dt>已选条件：</dt>
<dd style="DISPLAY: none" class=clearDd>
<div class=clearList></div>
</dl>
</div>
<script type="text/javascript" src="js/multiSelect.js"></script>
</div>
</div>
<div id="main" style="width: 1900px;height:600px;"></div>
</body>
<script>
var myChart = echarts.init(document.getElementById('main'))
option = {
legend: {},
tooltip: {},
dataset: {
// 提供一份数据。
source: [
['quey', 'quey1', 'quey2', 'quey3'],
['4月', 43.3, 85.8, 93.7],
['5月', 83.1, 73.4, 55.1],
['6月', 86.4, 65.2, 82.5],
['7月', 72.4, 53.9, 39.1]
]
},
// 声明一个 X 轴，类目轴（category）。默认情况下，类目轴对应到 dataset 第一列。
xAxis: {type: 'category'},
// 声明一个 Y 轴，数值轴。
yAxis: {},
// 声明多个 bar 系列，默认情况下，每个系列会自动对应到 dataset 的每一列。
series: [
{type: 'bar'},
{type: 'bar'},
{type: 'bar'}
]
}
myChart.setOption(option);
</script>

</html>

header.css

/* CSS Document */
@import url(common.css);
.top_box{width:1200px; height:78px; margin:0 auto; overflow:hidden;}
.top_logo{width:250px; height:78px; background:url(../images/top_ico.jpg) no-repeat top;}
.top_logo a{width:250px; height:78px; display:block;}
.top_gd{width:90px; height:78px; background:url(../images/top_ico.jpg) no-repeat 0 -156px;}
.top_tel{width:250px; height:78px; background:url(../images/top_ico.jpg) no-repeat 0 -78px;}

.top_menu_box{width:100%; height:40px; background:#0d93cc;}
.top_menu_box ul{width:1200px; height:40px; margin:0 auto; display:block;}
.top_menu_box li{line-height:40px;}
.top_menu_box li.menu_r{width:2px; height:40px; float:left; background:url(../images/menu_r_2x22.gif) no-repeat 0 9px;}
.top_menu_box li a:link,.top_menu_box li a:visited{ font-size:16px; color:#fff; padding:0 30px; font-family:"微软雅黑"; display:block;}
.top_menu_box li a:hover,.top_menu_box li a:active{ font-size:16px; color:#fff; padding:0 30px; font-family:"微软雅黑"; background:#0f7aa8; text-decoration:none}
.top_menu_box li.cur{ height:37px; line-height:34px; border-top:3px solid #f96e03; background:#0f7aa8;}

.top_menu_box li.member{background:#fa7003;}

jquery.ad-gallery.css

.ad-gallery {
width: 870px;
}
#descriptions {
position: relative;
height: 50px;
background: #EEE;
margin-top: 10px;
width: 640px;
padding: 10px;
overflow: hidden;
}
#descriptions .ad-image-description {
position: absolute;
}
#descriptions .ad-image-description .ad-description-title {
display: block;
}
.ad-gallery, .ad-gallery * {
margin: 0;
padding: 0;
}
.ad-gallery .ad-image-wrapper {
/*width: 100%;*/
width: 550px;
margin:30px auto 10px;
height: 366px;
position: relative;
overflow: hidden;
}
.ad-gallery .ad-image-wrapper .ad-loader {
position: absolute;
z-index: 10;
top: 48%;
left: 48%;
border: 1px solid #CCC;
}
.ad-gallery .ad-image-wrapper .ad-next {
position: absolute;
right: 0;
top: 0;
width: 25%;
height: 100%;
cursor: pointer;
display: block;
z-index: 100;
}
.ad-gallery .ad-image-wrapper .ad-prev {
position: absolute;
left: 0;
top: 0;
width: 25%;
height: 100%;
cursor: pointer;
display: block;
z-index: 100;
}
.ad-gallery .ad-image-wrapper .ad-prev, .ad-gallery .ad-image-wrapper .ad-next {
/* Or else IE will hide it */
background: url(../images/non-existing.jpg)\9
}
.ad-gallery .ad-image-wrapper .ad-prev .ad-prev-image, .ad-gallery .ad-image-wrapper .ad-next .ad-next-image {
background: url(../images/ad_prev.png);
width: 30px;
height: 30px;
display: none;
position: absolute;
top: 47%;
left: 0;
z-index: 101;
}
.ad-gallery .ad-image-wrapper .ad-next .ad-next-image {
background: url(../images/ad_next.png);
width: 30px;
height: 30px;
right: 0;
left: auto;
}
.ad-gallery .ad-image-wrapper .ad-image {
position: absolute;
overflow: hidden;
top: 0;
left: 0;
z-index: 9;
}
.ad-gallery .ad-image-wrapper .ad-image a img {
border: 0;
}
.ad-gallery .ad-image-wrapper .ad-image .ad-image-description {
position: absolute;
bottom: 0px;
left: 0px;
padding: 7px;
text-align: left;
width: 100%;
z-index: 2;
background: url(../images/opa75.png);
color: #000;
}
* html .ad-gallery .ad-image-wrapper .ad-image .ad-image-description {
background: none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true, sizingMethod=scale, src='../images/opa75.png');
}
.ad-gallery .ad-image-wrapper .ad-image .ad-image-description .ad-description-title {
display: block;
}
.ad-gallery .ad-controls {
height: 35px;
line-height:35px;
width:550px;
margin:0 auto;
}
.ad-gallery .ad-info {
float:right;
}
.ad-description-title{
font-size:16px;}
.ad-gallery .ad-slideshow-controls {
display:none !important;
float: right;
}
.ad-gallery .ad-slideshow-controls .ad-slideshow-start, .ad-gallery .ad-slideshow-controls .ad-slideshow-stop {
padding-left: 5px;
cursor: pointer;
}
.ad-gallery .ad-slideshow-controls .ad-slideshow-countdown {
padding-left: 5px;
font-size: 0.9em;
}
.ad-gallery .ad-slideshow-running .ad-slideshow-start {
cursor: default;
font-style: italic;
}
.ad-gallery .ad-nav {
width: 710px;
padding:15px 80px;
position: relative;
background-color:#ebf7fd;
}
.ad-gallery .ad-forward, .ad-gallery .ad-back {
position: absolute;
top: 0;
height: 100%;
z-index: 10;
}
/* IE 6 doesn't like height: 100% */
* html .ad-gallery .ad-forward, .ad-gallery .ad-back {
height: 100px;
}
.ad-gallery .ad-back {
cursor: pointer;
left: 5%;
top:20%;
width: 13px;
display: block;
background: url(../images/ad_scroll_back.png) 0px 22px no-repeat;
}
.ad-gallery .ad-forward {
cursor: pointer;
display: block;
right: 5%;
top:20%;
width: 13px;
background: url(../images/ad_scroll_forward.png) 0px 22px no-repeat;
}
.ad-gallery .ad-nav .ad-thumbs {
overflow: hidden;
width: 100%;
}
.ad-gallery .ad-thumbs .ad-thumb-list {
float: left;
width: 9000px;
list-style: none;
}
.ad-gallery .ad-thumbs li {
float: left;
padding-right:6px;
}
.ad-gallery .ad-thumbs li a {
display: block;
}
.ad-gallery .ad-thumbs li a img {
border: 3px solid #CCC;
display: block;
}
.ad-gallery .ad-thumbs li a.ad-active img {
border: 3px solid #ff6600;
}
/* Can't do display none, since Opera won't load the images then */
.ad-preloads {
position: absolute;
left: -9000px;
top: -9000px;

}

list.css

body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,form,img,dl,dt,dd,table,th,td,blockquote,fieldset,div,strong,label,em{margin:0;padding:0;border:0;}
ul,ol,li{list-style:none;}
input,button{margin:0;font-size:12px;vertical-align:middle;}
body{font-size:12px;font-family:SimSun,Arial,Helvetica,sans-serif;color:#333;margin:0 auto;}
table{border-collapse:collapse;border-spacing:0;}
a{color:#333;text-decoration:none;}
a:hover{text-decoration:none;color:#118ecc;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix{display:inline-block;}
* html .clearfix{height:1%;}
.clearfix{display:block;}
.w1200{width:1200px;margin:0 auto;}
.w870{width:870px;float:left;}
.w300{float:left;width:300px;overflow:hidden;}
.mar30{margin-right:30px;}
.mat10{margin-top:10px;}
.mal10{margin-left:10px;}
.mar10{margin-right:10px;}
.mab10{margin-bottom:10px;}
.mab20{margin-bottom:20px;}
.fl{float:left;}
.fr{float:right;}
.ld{position:relative;}
.ab{position:absolute;}
.ui-tab-container{width:1070px;float:left;position:relative;}
.ui-tab-container ul{border-bottom:1px solid #ddd;padding-left:60px;}
.ui-tab-container ul li{float:left;padding:5px 20px 5px 10px;background:url(../images/jdlist_434.png) 85% center no-repeat;margin:0 5px;cursor:pointer;border-bottom:none;}
#target{height:50px;}
#target span{line-height:50px;padding-right:10px;}
#target span a{color:#118ecc;}
.screenBox dl{border-bottom:#e6e6e6 1px dashed;overflow:hidden;padding:10px 0;_zoom:1;}
.screenBox dl.noborder{border-bottom:0px;border-left:0px;border-top:0px;border-right:0px;}
.screenBox dl.goodstype{border-bottom:#e6e6e6 1px dashed;}
.screenBox dl dt{float:left;}
.screenBox dl dt{text-align:left;width:80px;font-weight:600;padding-top:6px;}
.screenBox dl dd{position:relative;padding-left:0px;width:620px;padding-right:48px;float:left;padding-top:0px;vertical-align:middle;}
.screenBox dl dd label{line-height:14px;margin:0px 25px 0px 0px;color:#666;overflow:hidden;text-decoration:none;float:left;display:block;vertical-align:middle;}
.custom{position:absolute;right:-200px;top:0;width:300px;}
#custext1,#custext2{width:60px;}
#cusbtn{border:none;background:url(../images/jdlist_436.png) no-repeat;width:45px;height:22px;margin-left:5px;cursor:pointer;}
.screenBox dl dd label input{float:left;width:13px;height:13px;margin-right:3px;margin-top:5px;}
.screenBox dl dd label a{padding:5px 8px 5px 3px;display:inline-block;}
.screenBox dl dd a:hover{background:#39c;color:#fff;}
.screenBox dl dd a.selected{background:#39c;color:#fff;}
.screenBox dl dd span.more{position:absolute;width:39px;display:block;height:14px;top:5px;cursor:pointer;right:1px;}
.screenBox dl dd span.more em{background:url(../images/jdlist_434.png) no-repeat 0 5px;display:inline-block;float:right;width:10px;height:14px;}
#time-num{position:absolute;left:10px;top:10px;}
#time-num font{color:#fa7003;}
.hasBeenSelected{border-top:#ddd 1px solid;padding:2px;overflow:hidden;background:#f5f9fa;padding-left:100px;position:relative;}
.hasBeenSelected dl{overflow:hidden;}
.hasBeenSelected dl dt{float:left;}
.hasBeenSelected dl dd{float:left;}
.hasBeenSelected dl dt{text-align:right;line-height:30px;width:108px;height:30px;}
.hasBeenSelected dl dd{padding-bottom:4px;padding-left:0px;width:676px;padding-right:0px;padding-top:0px;}
.selectedInfor{border-bottom:#f60 1px solid;position:relative;border-left:#f60 1px solid;padding-bottom:1px;margin:4px 10px 0px 0px;padding-left:5px;padding-right:17px;display:block;white-space:nowrap;background:#fff;float:left;height:17px;border-top:#f60 1px solid;border-right:#f60 1px solid;padding-top:1px;}
.selectedInfor label{color:#f60;}
.eliminateCriteria{line-height:21px;margin-top:4px;width:80px;float:left;color:#118ecc;cursor:pointer;}
.selectedInfor em{background:url("../images/close.gif") no-repeat;cursor:pointer;display:block;height:13px;overflow:hidden;position:absolute;right:2px;top:3px;width:13px;}
.ui-tab-container ul li.ui-tab-active{background:url(../images/jdlist_433.png) 90% center no-repeat #f5f9fa;margin-bottom:-1px;border-style:solid;border-width:1px;border-color:#ddd;border-bottom:1px solid #f5f9fa;color:#118ecc;font-weight:700;}
.ui-tab-container ul.ui-tab-list2 li{
background-image:none;padding:5px 10px;
}
.ui-tab-container ul.ui-tab-list2 li.ui-tab-active{
background-image:none; }
.ui-tab-container ul li.ui-tab-disable{background:#ff0000;border-bottom:1px solid #999;margin-bottom:-1px;}
.ui-tab-container .ui-tab-content{padding:10px;border:1px solid #ddd;border-top:none;background:#f5f9fa;}
.ui-tab-container .ui-tab-content2{padding:10px;border:1px solid #ddd;border-top:none;background:#f5f9fa;}
.ui-tab-container .ui-tab-content p{float:left;display:inline;padding:3px 5px;margin-right:20px;vertical-align:middle;}
.ui-tab-container .ui-tab-content p input{margin-right:5px;}
.left-head{height:40px;padding:0 20px;background-color:#ebf7fd;overflow:hidden;}
.head-right{float:right;}
.head-left{width:500px;}
.head-left span{display:block;height:22px;line-height:22px;float:left;margin-top:10px;}
.head-left a{text-indent:-999em;display:inline-block;margin-left:10px;height:22px;width:70px;margin-top:10px;cursor:pointer;}
.head-left .recomment{background:url(../images/jdlist_438.png) no-repeat;width:70px;}
.head-left .good{background:url(../images/jdlist_439.png) no-repeat;}
.head-left .price{background:url(../images/jdlist_4310.png) no-repeat;}
.head-right label{display:block;float:left;vertical-align:middle;margin-top:10px;margin-left:10px;}
.head-right label input{float:left;width:16px;height:16px;}
.left-box2{border-top:2px solid #39b1ec;}
.left-box{border-bottom:2px solid #39b1ec;}
.danbao{padding:3px 5px;background-color:#e0eef3;color:#118ecc;}
.yuding{background:url(../images/jdxq_7620.png) no-repeat;display:block;width:50px;height:24px;text-indent:-999em;}
.tablelist-p{padding-left:20px;}
.leftbox-more{position:relative;height:34px;}
.leftbox-morea{position:absolute;right:10px;top:8px;text-align:right;}
.leftbox-morea span font{font-size:12px;}
.leftbox-morea span{color:#118ecc !important;}
.leftbox-morea span i{border-style:solid;border-top-color:#118ecc;border-bottom-color:#fff;border-left-color:#fff;border-right-color:#fff;border-width:6px;float:right;display:block;height:0;overflow:hidden;width:0px;border-bottom-width:1px;margin-top:3px;margin-left:3px;}
.lefttable-list thead tr{border-bottom:1px solid #e1e5e8;}
.lefttable-list tbody tr{border-bottom:1px dashed #ddd;}
.lefttable-list{color:#888;}
.lefttable-list thead tr p{padding-left:40px;text-align:left;}
.lefttable-list tbody tr table tr{border:none;}
.left-content{padding:10px 0;}
.left-content .map-a{color:#118ecc;}
.screen-top{padding:8px 0;background-color:#f6f6f6;}
.screen-top span{font-size:14px;padding-left:15px;}
.screen-top span input{padding:3px;margin-left:10px;height:22px;}
.jiud-name{font-weight:600;padding-top:6px;text-align:left;width:80px;float:left;}
.list-screen{border:1px solid #ddd;border-top:2px solid #ffa63c;}
#submit-btn{background:url(../images/jdlist_432.png) no-repeat;width:86px;height:30px;text-indent:-999em;display:block;position:absolute;right:10px;top:8px;}
.w410{width:410px;}
.w210{width:210px;}
.w260{width:260px;}
.w230{width:230px;}
.w180{width:180px;}
.imgsort .w410{height:250px;overflow:hidden;}
.imgsort .w210{height:120px;overflow:hidden;}
.imgsort .w260{height:120px;overflow:hidden;}
.imgsort .w230{height:120px;overflow:hidden;}
.imgsort .w180{height:120px;overflow:hidden;}
#imgtit-info h2{font-family:"Microsoft YaHei";font-weight:normal;}
#imgtit-info h2 font{color:#118ecc;font-size:24px;}
#imgtit-info h2 span{font-size:14px;color:#888;padding:0 8px;}
#imgtit-info .imgtit-address{height:26px;line-height:26px;}
#imgtit-info .imgtit-address font,#imgtit-info .imgtit-address font a{color:#118ecc !important;padding-left:25px;position:relative;font-size:12px;display:inline-block;}
#imgtit-info .imgtit-address font i{background:url(../images/jdxq_7612.png) no-repeat;width:17px;height:22px;position:absolute;}
#imgtit-schedule .imgtit-schedule-info{padding-top:10px;}
#imgtit-schedule .imgtit-schedule-info span{margin-right:10px;}
#imgtit-schedule .schedule-btn{margin-top:5px;}
.schedule-btn{background:url(../images/jdxq_767.png) no-repeat;width:120px;height:40px;float:left;display:block;text-indent:-999em;}
.imgicon{height:36px;padding-top:10px;}
.imgicon a.all-more{color:#118ecc;}
.pic-title{border-left:1px solid #b5cce2;border-bottom:1px solid #51aad5;}
.pic-title a{display:inline-block;height:42px;line-height:42px;padding:0 38px;font-size:18px;color:#118ecc;background-color:#ebf7fd;border-top:1px solid #b5cce2;border-right:1px solid #b5cce2;}
.pic-title a:hover{color:#fff;background-color:#51abd6;}
.pic-title a font{font-weight:normal;}
.pic-title-tab{border-bottom:1px solid #51aad5;}
.pic-title-tab span{padding:10px 0 10px 26px;display:block;vertical-align:middle;float:left;position:relative;}
.pic-title-tab span a{padding-right:26px;color:#118ecc;}
.pic-title-tab span a font{font-size:12px;color:#888;}
.pic-title-tab span.cur a{font-weight:bold;}
.pic-title-tab span.cur i{position:absolute;background:url(../images/jdimgls.jpg) no-repeat;width:10px;height:6px;display:block;left:45%;bottom:-1px;}
#reception{padding:0 5px;background-color:#f2f2f2;}
#reception .right-title{height:44px;line-height:44px;}
#reception .right-title span{height:44px;overflow:hidden;}
#reception .right-title span font{font-family:"Microsoft YaHei";color:#118ecc;}
#reception .righy-box{padding:10px 0 10px 64px;}
#reception .righy-box .ab{background:url(../images/jdxq_7627.png) no-repeat;width:31px;height:34px;left:20px;_left:-40px;top:5px;}
#reception .righy-box p{line-height:1.4em;}
.right-box .map{height:180px;width:300px;overflow:hidden;position:relative;}
.right-box .map .ab{display:block;width:72px;height:20px;line-height:20px;color:#fff !important;bottom:0;right:0;text-align:center;background-color:#0d93cc;}
.right-box .mt{height:40px;border:1px solid #d9dde0;border-top:2px solid #39b1ec;line-height:40px;padding:0 20px;}
.right-box .mt h3{color:#666;font-size:18px;font-family:"Microsoft YaHei";font-weight:normal;}
.right-box .mt .empty{color:#118ecc !important;cursor:pointer;}
.right-box .mc{border:1px solid #d9dde0;border-top:none;}
.right-box .mc ul{padding:15px 0;}
.right-box .mc ul li{height:26px;line-height:26px;zoom:1;padding:0 20px;}
.right-box .mc ul li a{color:#666;}
.right-box .mc ul li .money{color:#ff6600;}
.right-box .mc dl{margin:0 10px 5px;padding:0 10px 10px;}
.right-box .mc dl dt{height:36px;line-height:36px;}
.right-box .mc dl dt a{font-size:16px;color:#118ecc;}
.right-box .mc dl .d-text .p-con{color:#666;line-height:1.6em;}
.sign{
color: #555555;
font: 14px arial;
margin-right: 2px;
vertical-align: 5px;
}
.num{font-size:20px;font-family:"Microsoft YaHei";color:#ff6600;}
.dashed{border-bottom:1px dashed #999;}
.min-timetit{height:32px;padding:10px;line-height:32px;}
.min-timetit span{margin-right:30px;}
.min-timetit .alter-date{background-color:#0d93cc;padding:5px 8px;color:#fff;}
#minimg-table .tablelist-p{float:left;padding-left:20px;padding-right:20px;position:relative;}
#minimg-table .tablelist-p .trigon1{border-color:#FFFFFF #118ECC #FFFFFF;border-style:solid;border-width:6px 0 6px 6px;display:block;height:0;overflow:hidden;width:0;position:absolute;right:0;top:0;}
#minimg-table .trigon2 .tablelist-p .trigon1{border-color:#118ECC #FFFFFF #FFFFFF;border-style:solid;border-width:6px 6px 0;right:0;top:3px;}
#minimg-table .trigon2{border-bottom:none;}
#minimg-table .child_row_02{border-bottom:none;display:none;}
#minimg-table .child_row_02 .tab-none2{padding:10px 25px;border:1px solid #e3e7e9;}
#minimg-table .child_row_02 .tab-none2 i{background:url(../images/child_rowbg.jpg) no-repeat;width:12px;height:7px;position:absolute;display:block;top:-6px;left:5%;}
.through{text-decoration:line-through;color:#888;}
.bord4{border:1px solid #d9dde0;}
.left-table .tab-con .mt{border-bottom:1px solid #d9dde0;height:40px;background-color:#ebf7fd;}
.left-table .tab-con .mt h3{line-height:40px;color:#118ecc;padding-left:20px;}
.left-table .tab-con .mc{padding:20px;}
.left-table .tab-con .mc .tab-recom a{color:#118ecc;}
.left-table .tab-con .mc .tab-recom .more{width:90px;height:24px;line-height:24px;text-align:center;background:url(../images/more_bg.png) no-repeat;}
.left-table .tab-con .mc .tab-recom .fr{margin-right:10px;}
.left-table4 .mt{background-color:#ebf7fd;border-top:2px solid #39b1ec;height:42px;}
.left-table4 .mt h3{font-family:"Microsoft YaHei";font-weight:normal;font-size:18px;line-height:42px;padding-left:20px;color:#118ecc;}
.left-table4 .mc .min-ingtab tr td{padding:10px 20px;border-bottom:1px dashed #ccc;color:#666;}
.left-table4 .mc table tr.last td{border-bottom:none;}
.yelp{padding:6px 15px;background-color:#fa7003;font-size:16px;color:#fff;vertical-align:middle;display:inline-block;}
.pic-title-tab span.yelp_ico{padding-left:50px;background:url(../images/jdxq_7625.png) no-repeat 13px 8px;}
.pic-each{padding:15px 0;}
.pic-each a{padding:5px 8px;background-color:#e3ecf2;margin-left:10px;}
.pic-each a:hover{background-color:#0d93cc;color:#fff;}
.discuss .p-img{width:80px;text-align:center;}
.discuss .p-img span{display:block;height:24px;line-height:24px;}
.discuss .mc{padding:10px 0;border-bottom:1px dashed #888;}
.discuss .p-text{padding-left:40px;}
.discuss .p-text p{line-height:2em;}
.discuss .p-text .p-date{line-height:2em;color:#888;}
.discuss .p-text i{background:url(../images/jdxq_7626.png) no-repeat;width:19px;height:19px;top:5px;left:10px;}
.discuss .p-ioc{background:url(../images/jdxq_7628.png) no-repeat;padding-left:25px;padding-bottom:10px;margin-right:30px;}
.discuss .p-ioc a{color:#118ecc;}
.pic-page .mc{padding:30px 0;text-align:center;}
.pic-page .mc .prev{background:url(../images/page-arl.png) no-repeat 8px center #bbb;padding:5px 15px 5px 20px;}
.pic-page .mc .next{background:url(../images/page-alr.png) no-repeat 91% center #bbb;padding:5px 20px 5px 15px;}
.pic-page .mc a{padding:5px 10px;background-color:#bbb;margin-left:10px;color:#fff;}
.pic-page .mc a.on{background-color:#ff8900;}

/*新加样式*/
#selectList .more_bg em{
background:url(../images/jdlist_433.png) no-repeat 0 5px;
}
.more-none{
padding:10px;}
.more-none input {
height: 25px;
margin-left: 5px;
margin-right:4px;
vertical-align: middle;
}
.more-i span i{
border-style:solid;border-top-color:#fff;border-bottom-color:#118ecc;border-left-color:#fff;border-right-color:#fff;border-width:6px;border-top-width:1px;}
.lefttable-list tr td p{
float:left;}

.lefttable-list tr td p.rw4 {
padding-right: 10px;
text-align: right;
width: 100px;
}

.lefttable-list tr td p.rw4 .price {
cursor: default;
display: inline-block;
}

.lefttable-list tr td p.rw5 {
width: 64px;
}
.lefttable-list tr td .tablelist-p{
width:160px; height:22px; line-height:22px;}
.iconFan {

color: #FF8800;
display: inline-block;
font-size: 11px;
height: 18px;
line-height: 18px;
margin-top: 3px;
text-align: right;
}
.iconLibao {
display: inline-block;
height: 22px;
vertical-align: -6px;
width: 50px;
margin-left:4px;
}
.medal {
display: inline-block;
height: 22px;
overflow: hidden;
width: 50px;
vertical-align:top;
}
/*分页*/
div.sabrosus{padding:3px;margin:3px;text-align:center; font-size:16px;}
div.sabrosus a{border:#9aafe5 1px solid;padding:2px 5px;margin:0 2px 0 0;text-decoration:none;}
div.sabrosus a:hover{border:#2b66a5 1px solid;color:#000;background-color:lightyellow;}
div.pagination a:active{border:#2b66a5 1px solid;color:#000;background-color:lightyellow;}
div.sabrosus span.current{border:navy 1px solid;padding:2px 5px;font-weight:bold;color:#fff;margin:0 2px 0 0;background-color:#2e6ab1}
div.sabrosus span.disabled{border:#929292 1px solid;padding:2px 5px;margin:0 2px 0 0;}

manhuaDate.1.0.css

*{padding:0; margin:0}
.calender{ width:200px; margin:40px auto 0; top:0; left:0; border:4px #D6D6D6 solid; background:#EBEBEB; position:absolute; display:none; z-index:999;}
.calendertb{width:100%;}
.calendertb td{width:25px; height:25px;border:1px #CCCCCC solid; text-align:center; vertical-align:middle; cursor:pointer; font-size:14px; font-weight:bold;}
.calendertb td.hover,.calendertb td.weekendhover{background:#D6D6D6;}
.calendertb th{width:25px; height:20px;border:1px #CCCCCC solid; text-align:center; vertical-align:middle; cursor:pointer; color:#979797; }
.tdtoday{ background:#0080FF;color:#fff;width:25px; height:25px;border:1px #CCCCCC solid; text-align:center; vertical-align:middle; cursor:pointer; font-size:14px; font-weight:bold;}
.getyear{ height:35px; line-height:35px; width:100%; text-align:center;}
.preMonth{ font-size:12px; font-weight:bold; cursor:pointer; margin-right:5px;color:#0080FF;}
.nextMonth{ font-size:12px; font-weight:bold; cursor:pointer; margin-left:5px;color:#0080FF;}
.mh_date{width:150px; }
.zhezhao{width:100%; height:100%; position:fixed; z-index:998; background:#fff;filter:alpha(opacity=10);opacity:0.1; display:none; }

jquery.ad-gallery.js

/**
* Copyright (c) 2010 Anders Ekdahl (http://coffeescripter.com/)
* Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
* and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
*
* Version: 1.2.4
*
* Demo and documentation: http://coffeescripter.com/code/ad-gallery/
*/
(function($) {
$.fn.adGallery = function(options) {
var defaults = { loader_image: 'loader.gif',
start_at_index: 0,
description_wrapper: false,
thumb_opacity: 0.7,
animate_first_image: false,
animation_speed: 400,
width: false,
height: false,
display_next_and_prev: true,
display_back_and_forward: true,
scroll_jump: 0, // If 0, it jumps the width of the container
slideshow: {
enable: true,
autostart: false,
speed: 5000,
start_label: 'Start',
stop_label: 'Stop',
stop_on_scroll: true,
countdown_prefix: '(',
countdown_sufix: ')',
onStart: false,
onStop: false
},
effect: 'slide-hori', // or 'slide-vert', 'fade', or 'resize', 'none'
enable_keyboard_move: true,
cycle: true,
callbacks: {
init: false,
afterImageVisible: false,
beforeImageVisible: false
}
};
var settings = $.extend(false, defaults, options);
if(options && options.slideshow) {
settings.slideshow = $.extend(false, defaults.slideshow, options.slideshow);
};
if(!settings.slideshow.enable) {
settings.slideshow.autostart = false;
};
var galleries = [];
$(this).each(function() {
var gallery = new AdGallery(this, settings);
galleries[galleries.length] = gallery;
});
// Sorry, breaking the jQuery chain because the gallery instances
// are returned so you can fiddle with them
return galleries;
};

function VerticalSlideAnimation(img_container, direction, desc) {
var current_top = parseInt(img_container.css('top'), 10);
if(direction == 'left') {
var old_image_top = '-'+ this.image_wrapper_height +'px';
img_container.css('top', this.image_wrapper_height +'px');
} else {
var old_image_top = this.image_wrapper_height +'px';
img_container.css('top', '-'+ this.image_wrapper_height +'px');
};
if(desc) {
desc.css('bottom', '-'+ desc[0].offsetHeight +'px');
desc.animate({bottom: 0}, this.settings.animation_speed * 2);
};
if(this.current_description) {
this.current_description.animate({bottom: '-'+ this.current_description[0].offsetHeight +'px'}, this.settings.animation_speed * 2);
};
return {old_image: {top: old_image_top},
new_image: {top: current_top}};
};

function HorizontalSlideAnimation(img_container, direction, desc) {
var current_left = parseInt(img_container.css('left'), 10);
if(direction == 'left') {
var old_image_left = '-'+ this.image_wrapper_width +'px';
img_container.css('left',this.image_wrapper_width +'px');
} else {
var old_image_left = this.image_wrapper_width +'px';
img_container.css('left','-'+ this.image_wrapper_width +'px');
};
if(desc) {
desc.css('bottom', '-'+ desc[0].offsetHeight +'px');
desc.animate({bottom: 0}, this.settings.animation_speed * 2);
};
if(this.current_description) {
this.current_description.animate({bottom: '-'+ this.current_description[0].offsetHeight +'px'}, this.settings.animation_speed * 2);
};
return {old_image: {left: old_image_left},
new_image: {left: current_left}};
};

function ResizeAnimation(img_container, direction, desc) {
var image_width = img_container.width();
var image_height = img_container.height();
var current_left = parseInt(img_container.css('left'), 10);
var current_top = parseInt(img_container.css('top'), 10);
img_container.css({width: 0, height: 0, top: this.image_wrapper_height / 2, left: this.image_wrapper_width / 2});
return {old_image: {width: 0,
height: 0,
top: this.image_wrapper_height / 2,
left: this.image_wrapper_width / 2},
new_image: {width: image_width,
height: image_height,
top: current_top,
left: current_left}};
};

function FadeAnimation(img_container, direction, desc) {
img_container.css('opacity', 0);
return {old_image: {opacity: 0},
new_image: {opacity: 1}};
};

// Sort of a hack, will clean this up... eventually
function NoneAnimation(img_container, direction, desc) {
img_container.css('opacity', 0);
return {old_image: {opacity: 0},
new_image: {opacity: 1},
speed: 0};
};

function AdGallery(wrapper, settings) {
this.init(wrapper, settings);
};
AdGallery.prototype = {
// Elements
wrapper: false,
image_wrapper: false,
gallery_info: false,
nav: false,
loader: false,
preloads: false,
thumbs_wrapper: false,
scroll_back: false,
scroll_forward: false,
next_link: false,
prev_link: false,

slideshow: false,
image_wrapper_width: 0,
image_wrapper_height: 0,
current_index: 0,
current_image: false,
current_description: false,
nav_display_width: 0,
settings: false,
images: false,
in_transition: false,
animations: false,
init: function(wrapper, settings) {
var context = this;
this.wrapper = $(wrapper);
this.settings = settings;
this.setupElements();
this.setupAnimations();
if(this.settings.width) {
this.image_wrapper_width = this.settings.width;
this.image_wrapper.width(this.settings.width);
this.wrapper.width(this.settings.width);
} else {
this.image_wrapper_width = this.image_wrapper.width();
};
if(this.settings.height) {
this.image_wrapper_height = this.settings.height;
this.image_wrapper.height(this.settings.height);
} else {
this.image_wrapper_height = this.image_wrapper.height();
};
this.nav_display_width = this.nav.width();
this.current_index = 0;
this.current_image = false;
this.current_description = false;
this.in_transition = false;
this.findImages();
if(this.settings.display_next_and_prev) {
this.initNextAndPrev();
};
// The slideshow needs a callback to trigger the next image to be shown
// but we don't want to give it access to the whole gallery instance
var nextimage_callback = function(callback) {
return context.nextImage(callback);
};
this.slideshow = new AdGallerySlideshow(nextimage_callback, this.settings.slideshow);
this.controls.append(this.slideshow.create());
if(this.settings.slideshow.enable) {
this.slideshow.enable();
} else {
this.slideshow.disable();
};
if(this.settings.display_back_and_forward) {
this.initBackAndForward();
};
if(this.settings.enable_keyboard_move) {
this.initKeyEvents();
};
var start_at = parseInt(this.settings.start_at_index, 10);
if(window.location.hash && window.location.hash.indexOf('#ad-image') === 0) {
start_at = window.location.hash.replace(/[^0-9]+/g, '');
// Check if it's a number
if((start_at * 1) != start_at) {
start_at = this.settings.start_at_index;
};
};

this.loading(true);
this.showImage(start_at,
function() {
// We don't want to start the slideshow before the image has been
// displayed
if(context.settings.slideshow.autostart) {
context.preloadImage(start_at + 1);
context.slideshow.start();
};
}
);
this.fireCallback(this.settings.callbacks.init);
},
setupAnimations: function() {
this.animations = {
'slide-vert': VerticalSlideAnimation,
'slide-hori': HorizontalSlideAnimation,
'resize': ResizeAnimation,
'fade': FadeAnimation,
'none': NoneAnimation
};
},
setupElements: function() {
this.controls = this.wrapper.find('.ad-controls');
this.gallery_info = $('<p class="ad-info"></p>');
this.controls.append(this.gallery_info);
this.image_wrapper = this.wrapper.find('.ad-image-wrapper');
this.image_wrapper.empty();
this.nav = this.wrapper.find('.ad-nav');
this.thumbs_wrapper = this.nav.find('.ad-thumbs');
this.preloads = $('<div class="ad-preloads"></div>');
this.loader = $('<img class="ad-loader" src="'+ this.settings.loader_image +'">');
this.image_wrapper.append(this.loader);
this.loader.hide();
$(document.body).append(this.preloads);
},
loading: function(bool) {
if(bool) {
this.loader.show();
} else {
this.loader.hide();
};
},
addAnimation: function(name, fn) {
if($.isFunction(fn)) {
this.animations[name] = fn;
};
},
findImages: function() {
var context = this;
this.images = [];
var thumb_wrapper_width = 0;
var thumbs_loaded = 0;
var thumbs = this.thumbs_wrapper.find('a');
var thumb_count = thumbs.length;
if(this.settings.thumb_opacity < 1) {
thumbs.find('img').css('opacity', this.settings.thumb_opacity);
};
thumbs.each(
function(i) {
var link = $(this);
var image_src = link.attr('href');
var thumb = link.find('img');
// Check if the thumb has already loaded
if(!context.isImageLoaded(thumb[0])) {
thumb.load(
function() {
thumb_wrapper_width += this.parentNode.parentNode.offsetWidth;
thumbs_loaded++;
}
);
} else{
thumb_wrapper_width += thumb[0].parentNode.parentNode.offsetWidth;
thumbs_loaded++;
};
link.addClass('ad-thumb'+ i);
link.click(
function() {
context.showImage(i);
context.slideshow.stop();
return false;
}
).hover(
function() {
if(!$(this).is('.ad-active') && context.settings.thumb_opacity < 1) {
$(this).find('img').fadeTo(300, 1);
};
context.preloadImage(i);
},
function() {
if(!$(this).is('.ad-active') && context.settings.thumb_opacity < 1) {
$(this).find('img').fadeTo(300, context.settings.thumb_opacity);
};
}
);
var link = false;
if(thumb.data('ad-link')) {
link = thumb.data('ad-link');
} else if(thumb.attr('longdesc') && thumb.attr('longdesc').length) {
link = thumb.attr('longdesc');
};
var desc = false;
if(thumb.data('ad-desc')) {
desc = thumb.data('ad-desc');
} else if(thumb.attr('alt') && thumb.attr('alt').length) {
desc = thumb.attr('alt');
};
var title = false;
if(thumb.data('ad-title')) {
title = thumb.data('ad-title');
} else if(thumb.attr('title') && thumb.attr('title').length) {
title = thumb.attr('title');
};
context.images[i] = { thumb: thumb.attr('src'), image: image_src, error: false,
preloaded: false, desc: desc, title: title, size: false,
link: link };
}
);
// Wait until all thumbs are loaded, and then set the width of the ul
var inter = setInterval(
function() {
if(thumb_count == thumbs_loaded) {
thumb_wrapper_width -= 100;
var list = context.nav.find('.ad-thumb-list');
list.css('width', thumb_wrapper_width +'px');
var i = 1;
var last_height = list.height();
while(i < 201) {
list.css('width', (thumb_wrapper_width + i) +'px');
if(last_height != list.height()) {
break;
}
last_height = list.height();
i++;
}
clearInterval(inter);
};
},
100
);
},
initKeyEvents: function() {
var context = this;
$(document).keydown(
function(e) {
if(e.keyCode == 39) {
// right arrow
context.nextImage();
context.slideshow.stop();
} else if(e.keyCode == 37) {
// left arrow
context.prevImage();
context.slideshow.stop();
};
}
);
},
initNextAndPrev: function() {
this.next_link = $('<div class="ad-next"><div class="ad-next-image"></div></div>');
this.prev_link = $('<div class="ad-prev"><div class="ad-prev-image"></div></div>');
this.image_wrapper.append(this.next_link);
this.image_wrapper.append(this.prev_link);
var context = this;
this.prev_link.add(this.next_link).mouseover(
function(e) {
// IE 6 hides the wrapper div, so we have to set it's width
$(this).css('height', context.image_wrapper_height);
$(this).find('div').show();
}
).mouseout(
function(e) {
$(this).find('div').hide();
}
).click(
function() {
if($(this).is('.ad-next')) {
context.nextImage();
context.slideshow.stop();
} else {
context.prevImage();
context.slideshow.stop();
};
}
).find('div').css('opacity', 0.7);
},
initBackAndForward: function() {
var context = this;
this.scroll_forward = $('<div class="ad-forward"></div>');
this.scroll_back = $('<div class="ad-back"></div>');
this.nav.append(this.scroll_forward);
this.nav.prepend(this.scroll_back);
var has_scrolled = 0;
var thumbs_scroll_interval = false;
$(this.scroll_back).add(this.scroll_forward).click(
function() {
// We don't want to jump the whole width, since an image
// might be cut at the edge
var width = context.nav_display_width - 50;
if(context.settings.scroll_jump > 0) {
var width = context.settings.scroll_jump;
};
if($(this).is('.ad-forward')) {
var left = context.thumbs_wrapper.scrollLeft() + width;
} else {
var left = context.thumbs_wrapper.scrollLeft() - width;
};
if(context.settings.slideshow.stop_on_scroll) {
context.slideshow.stop();
};
context.thumbs_wrapper.animate({scrollLeft: left +'px'});
return false;
}
).css('opacity', 0.6).hover(
function() {
var direction = 'left';
if($(this).is('.ad-forward')) {
direction = 'right';
};
thumbs_scroll_interval = setInterval(
function() {
has_scrolled++;
// Don't want to stop the slideshow just because we scrolled a pixel or two
if(has_scrolled > 30 && context.settings.slideshow.stop_on_scroll) {
context.slideshow.stop();
};
var left = context.thumbs_wrapper.scrollLeft() + 1;
if(direction == 'left') {
left = context.thumbs_wrapper.scrollLeft() - 1;
};
context.thumbs_wrapper.scrollLeft(left);
},
10
);
$(this).css('opacity', 1);
},
function() {
has_scrolled = 0;
clearInterval(thumbs_scroll_interval);
$(this).css('opacity', 0.6);
}
);
},
_afterShow: function() {
this.gallery_info.html((this.current_index + 1) +' / '+ this.images.length);
if(!this.settings.cycle) {
// Needed for IE
this.prev_link.show().css('height', this.image_wrapper_height);
this.next_link.show().css('height', this.image_wrapper_height);
if(this.current_index == (this.images.length - 1)) {
this.next_link.hide();
};
if(this.current_index == 0) {
this.prev_link.hide();
};
};
this.fireCallback(this.settings.callbacks.afterImageVisible);
},
/**
* Checks if the image is small enough to fit inside the container
* If it's not, shrink it proportionally
*/
_getContainedImageSize: function(image_width, image_height) {
if(image_height > this.image_wrapper_height) {
var ratio = image_width / image_height;
image_height = this.image_wrapper_height;
image_width = this.image_wrapper_height * ratio;
};
if(image_width > this.image_wrapper_width) {
var ratio = image_height / image_width;
image_width = this.image_wrapper_width;
image_height = this.image_wrapper_width * ratio;
};
return {width: image_width, height: image_height};
},
/**
* If the image dimensions are smaller than the wrapper, we position
* it in the middle anyway
*/
_centerImage: function(img_container, image_width, image_height) {
img_container.css('top', '0px');
if(image_height < this.image_wrapper_height) {
var dif = this.image_wrapper_height - image_height;
img_container.css('top', (dif / 2) +'px');
};
img_container.css('left', '0px');
if(image_width < this.image_wrapper_width) {
var dif = this.image_wrapper_width - image_width;
img_container.css('left', (dif / 2) +'px');
};
},
_getDescription: function(image) {
var desc = false;
if(image.desc.length || image.title.length) {
var title = '';
if(image.title.length) {
title = '<strong class="ad-description-title">'+ image.title +'</strong>';
};
var desc = '';
if(image.desc.length) {
desc = '<span>'+ image.desc +'</span>';
};
//desc = $('<p class="ad-image-description">'+ title + desc +'</p>');这里可以放标题和alt
desc = $('<p class="ad-image-description">'+ title +'</p>');

};
return desc;
},
/**
* @param function callback Gets fired when the image has loaded, is displaying
* and it's animation has finished
*/
showImage: function(index, callback) {
if(this.images[index] && !this.in_transition) {
var context = this;
var image = this.images[index];
this.in_transition = true;
if(!image.preloaded) {
this.loading(true);
this.preloadImage(index, function() {
context.loading(false);
context._showWhenLoaded(index, callback);
});
} else {
this._showWhenLoaded(index, callback);
};
};
},
/**
* @param function callback Gets fired when the image has loaded, is displaying
* and it's animation has finished
*/
_showWhenLoaded: function(index, callback) {
if(this.images[index]) {
var context = this;
var image = this.images[index];
var img_container = $(document.createElement('div')).addClass('ad-image');
var img = $(new Image()).attr('src', image.image);
if(image.link) {
var link = $('<a href="'+ image.link +'" target="_blank"></a>');
link.append(img);
img_container.append(link);
} else {
img_container.append(img);
}
this.image_wrapper.prepend(img_container);
var size = this._getContainedImageSize(image.size.width, image.size.height);
img.attr('width', size.width);
img.attr('height', size.height);
img_container.css({width: size.width +'px', height: size.height +'px'});
this._centerImage(img_container, size.width, size.height);
var desc = this._getDescription(image, img_container);
var controls = this.wrapper.find('.ad-controls');
/* if(desc) {
if(!this.settings.description_wrapper) {
img_container.append(desc);
var width = size.width - parseInt(desc.css('padding-left'), 10) - parseInt(desc.css('padding-right'), 10);
desc.css('width', width +'px');
} else {
this.settings.description_wrapper.append(desc);
}
};*/
this.controls.append(desc);
this.highLightThumb(this.nav.find('.ad-thumb'+ index));

var direction = 'right';
if(this.current_index < index) {
direction = 'left';
};
this.fireCallback(this.settings.callbacks.beforeImageVisible);
if(this.current_image || this.settings.animate_first_image) {
var animation_speed = this.settings.animation_speed;
var easing = 'swing';
var animation = this.animations[this.settings.effect].call(this, img_container, direction, desc);
if(typeof animation.speed != 'undefined') {
animation_speed = animation.speed;
};
if(typeof animation.easing != 'undefined') {
easing = animation.easing;
};
if(this.current_image) {
var old_image = this.current_image;
var old_description = this.current_description;
old_image.animate(animation.old_image, animation_speed, easing,
function() {
old_image.remove();
if(old_description) old_description.remove();
}
);
};
img_container.animate(animation.new_image, animation_speed, easing,
function() {
context.current_index = index;
context.current_image = img_container;
context.current_description = desc;
context.in_transition = false;
context._afterShow();
context.fireCallback(callback);
}
);
} else {
this.current_index = index;
this.current_image = img_container;
context.current_description = desc;
this.in_transition = false;
context._afterShow();
this.fireCallback(callback);
};
};
},
nextIndex: function() {
if(this.current_index == (this.images.length - 1)) {
if(!this.settings.cycle) {
return false;
};
var next = 0;
} else {
var next = this.current_index + 1;
};
return next;
},
nextImage: function(callback) {
var next = this.nextIndex();
if(next === false) return false;
this.preloadImage(next + 1);
this.showImage(next, callback);
return true;
},
prevIndex: function() {
if(this.current_index == 0) {
if(!this.settings.cycle) {
return false;
};
var prev = this.images.length - 1;
} else {
var prev = this.current_index - 1;
};
return prev;
},
prevImage: function(callback) {
var prev = this.prevIndex();
if(prev === false) return false;
this.preloadImage(prev - 1);
this.showImage(prev, callback);
return true;
},
preloadAll: function() {
var context = this;
var i = 0;
function preloadNext() {
if(i < context.images.length) {
i++;
context.preloadImage(i, preloadNext);
};
};
context.preloadImage(i, preloadNext);
},
preloadImage: function(index, callback) {
if(this.images[index]) {
var image = this.images[index];
if(!this.images[index].preloaded) {
var img = $(new Image());
img.attr('src', image.image);
if(!this.isImageLoaded(img[0])) {
this.preloads.append(img);
var context = this;
img.load(
function() {
image.preloaded = true;
image.size = { width: this.width, height: this.height };
context.fireCallback(callback);
}
).error(
function() {
image.error = true;
image.preloaded = false;
image.size = false;
}
);
} else {
image.preloaded = true;
image.size = { width: img[0].width, height: img[0].height };
this.fireCallback(callback);
};
} else {
this.fireCallback(callback);
};
};
},
isImageLoaded: function(img) {
if(typeof img.complete != 'undefined' && !img.complete) {
return false;
};
if(typeof img.naturalWidth != 'undefined' && img.naturalWidth == 0) {
return false;
};
return true;
},
highLightThumb: function(thumb) {
this.thumbs_wrapper.find('.ad-active').removeClass('ad-active');
thumb.addClass('ad-active');
if(this.settings.thumb_opacity < 1) {
this.thumbs_wrapper.find('a:not(.ad-active) img').fadeTo(300, this.settings.thumb_opacity);
thumb.find('img').fadeTo(300, 1);
};
var left = thumb[0].parentNode.offsetLeft;
left -= (this.nav_display_width / 2) - (thumb[0].offsetWidth / 2);
this.thumbs_wrapper.animate({scrollLeft: left +'px'});
},
fireCallback: function(fn) {
if($.isFunction(fn)) {
fn.call(this);
};
}
};

function AdGallerySlideshow(nextimage_callback, settings) {
this.init(nextimage_callback, settings);
};
AdGallerySlideshow.prototype = {
start_link: false,
stop_link: false,
countdown: false,
controls: false,

settings: false,
nextimage_callback: false,
enabled: false,
running: false,
countdown_interval: false,
init: function(nextimage_callback, settings) {
var context = this;
this.nextimage_callback = nextimage_callback;
this.settings = settings;
},
create: function() {
this.start_link = $('<span class="ad-slideshow-start">'+ this.settings.start_label +'</span>');
this.stop_link = $('<span class="ad-slideshow-stop">'+ this.settings.stop_label +'</span>');
this.countdown = $('<span class="ad-slideshow-countdown"></span>');
this.controls = $('<div class="ad-slideshow-controls"></div>');
this.controls.append(this.start_link).append(this.stop_link).append(this.countdown);
this.countdown.hide();

var context = this;
this.start_link.click(
function() {
context.start();
}
);
this.stop_link.click(
function() {
context.stop();
}
);
$(document).keydown(
function(e) {
if(e.keyCode == 83) {
// 's'
if(context.running) {
context.stop();
} else {
context.start();
};
};
}
);
return this.controls;
},
disable: function() {
this.enabled = false;
this.stop();
this.controls.hide();
},
enable: function() {
this.enabled = true;
this.controls.show();
},
toggle: function() {
if(this.enabled) {
this.disable();
} else {
this.enable();
};
},
start: function() {
if(this.running || !this.enabled) return false;
var context = this;
this.running = true;
this.controls.addClass('ad-slideshow-running');
this._next();
this.fireCallback(this.settings.onStart);
return true;
},
stop: function() {
if(!this.running) return false;
this.running = false;
this.countdown.hide();
this.controls.removeClass('ad-slideshow-running');
clearInterval(this.countdown_interval);
this.fireCallback(this.settings.onStop);
return true;
},
_next: function() {
var context = this;
var pre = this.settings.countdown_prefix;
var su = this.settings.countdown_sufix;
clearInterval(context.countdown_interval);
this.countdown.show().html(pre + (this.settings.speed / 1000) + su);
var slide_timer = 0;
this.countdown_interval = setInterval(
function() {
slide_timer += 1000;
if(slide_timer >= context.settings.speed) {
var whenNextIsShown = function() {
// A check so the user hasn't stoped the slideshow during the
// animation
if(context.running) {
context._next();
};
slide_timer = 0;
};
if(!context.nextimage_callback(whenNextIsShown)) {
context.stop();
};
slide_timer = 0;
};
var sec = parseInt(context.countdown.text().replace(/[^0-9]/g, ''), 10);
sec--;
if(sec > 0) {
context.countdown.html(pre + sec + su);
};
},
1000
);
},
fireCallback: function(fn) {
if($.isFunction(fn)) {
fn.call(this);
};
}
};

})(jQuery);

multiSelect.js

$('.clearDd').show();
var okSelect = []; //已经选择好的
var oSelectList = document.getElementById('selectList');

var oClearList = $(".hasBeenSelected .clearList");
var oCustext1 = document.getElementById('custext1');
var oCustext2 = document.getElementById('custext2');
var aItemTxt = oSelectList.getElementsByTagName('a');
var isCusPrice = false;//是否自定义价格
var radioVal = '';

oSelectList.onclick = function(e, a) {
var ev = e || window.event;
var tag = ev.target || ev.srcElement;
if(!tag)return;
var tagName = tag.nodeName.toUpperCase();
var infor = '';
var aRadio = document.getElementsByName('radio2');

if( isCusPrice ) {
radioVal = oCustext1.value + '-' + oCustext2.value + '元';
} else {
radioVal = '';
}

if (tagName == 'INPUT') {
if (tag.getAttribute('type').toUpperCase() == 'CHECKBOX') { //如果点击的是 input checkbox
var val = next(tag);
if (tag.checked) {
var sType = prev(parents(tag, 'dd')).innerHTML;
val && okSelect.push(trim(val.innerHTML) + '|' + sType)
} else {
var sType = prev(parents(tag, 'dd')).innerHTML;
delStr(val.innerHTML + '|' + sType, okSelect)
}
} else if (tag.getAttribute('type').toUpperCase() == 'BUTTON') { //如果点击的是自定义价格按钮
radioVal = oCustext1.value + '-' + oCustext2.value + '元';
isCusPrice = true;

for (var i = 0; i < aRadio.length; i++) {
aRadio[i].checked = false;
}

}
}

if (tagName == 'A') { //如果点击的是 A
var oPrevInput = prev(tag);

if (!oPrevInput) { //如果上一个节点没有则认为点击的是 '不限'
var parent = parents(tag, 'dd');
var aItem = parent.getElementsByTagName('label');
if(parent.getAttribute('data-more')) {
var allCheckbox = next(parents(parent, 'dl')).getElementsByTagName('label');
var sType = '';
for (var i = 0, len = allCheckbox.length; i < len; i++) {
sType = prev(parents(allCheckbox[i], 'dd')).innerHTML;
delStr(text(allCheckbox[i]) + '|' + sType, okSelect);
allCheckbox[i].children[0].checked = false;
}
}

if (trim(prev(parent).innerHTML) == '时间范围') { //这里是直接根据 text来比较的.建议加个自定义属性作标识符
for (var i = 0; i < aRadio.length; i++) {
aRadio[i].checked = false;
}
isCusPrice = false;
a = true;
radioVal = '';
} else {
var sType = '';
for (var i = 0, len = aItem.length; i < len; i++) {
sType = prev(parents(aItem[i], 'dd')).innerHTML;
delStr(text(aItem[i]) + '|' + sType, okSelect);
aItem[i].children[0].checked = false;
}
}

} else {

if (oPrevInput && oPrevInput.getAttribute('type').toUpperCase() == 'RADIO') { //radio
isCusPrice = false;
oPrevInput.checked = true;
}

if (oPrevInput && oPrevInput.getAttribute('type').toUpperCase() == 'CHECKBOX') { //获取checkbox
if (oPrevInput.checked) {
oPrevInput.checked = false;
var sType = prev(parents(tag, 'dd')).innerHTML;
delStr(tag.innerHTML + '|' + sType, okSelect);
} else {
oPrevInput.checked = true;
var sType = prev(parents(tag, 'dd')).innerHTML;
okSelect.push(trim(tag.innerHTML) + '|' + sType)
}
}
}
};

for (var i = 0; i < aRadio.length; i++) {
if (aRadio[i].checked) {
radioVal = next(aRadio[i]).innerHTML;
isCusPrice = false;
break;
}
}

if(a) {
isCusPrice = false;
}

if(a && a == 2) {
for (var i = 0; i < aRadio.length; i++) {
aRadio[i].checked = false;
}

} else {
if (radioVal) infor += '<div class=\"selectedInfor selectedShow\"><span>时间范围</span><label>' + radioVal + '</label><em p="2"></em></div>';
}

var vals = [];
for (var i = 0,
size = okSelect.length; i < size; i++) {
vals = okSelect[i].split('|');
infor += '<div class=\"selectedInfor selectedShow\"><span>' + vals[1] + '</span><label>' + vals[0] + '</label><em></em></div>';
}
oClearList.html(infor);
};
$('div.eliminateCriteria').click(function(){
$(oSelectList).find('input').attr('checked',false);
radioVal = '';
isCusPrice = false;
okSelect.length = 0;
$(oSelectList).trigger('click', 1);
})

$('.clearList').find('em').on('click',function(){
var self = $(this);
var val = self.prev().html() + '|' + self.prev().prev().html();
var n = -1;
var a = this.getAttribute('p') || 1;
self.die('click');
for(var i = 0, len = aItemTxt.length; i < len; i++) {
var html = val.split('|')[0];
if(trim(aItemTxt[i].innerHTML) == html) {
prev(aItemTxt[i]).checked = false;
break;
}
};
delStr(val, okSelect);
$(oSelectList).trigger('click', a);

})

function delStr(str, arr) { //删除数组给定相同的字符串
var n = -1;
for (var i = 0,
len = arr.length; i < len; i++) {
if (str == arr[i]) {
n = i;
break;
}
}
n > -1 && arr.splice(n, 1);
};
function trim(str) {
return str.replace(/^\s+|\s+$/g, '')
};
function text(e) {
var t = '';
e = e.childNodes || e;
for (var j = 0; j < e.length; j++) {
t += e[j].nodeType != 1 ? e[j].nodeValue: text(e[j].childNodes);
}
return trim(t);
}

function prev(elem) {
do {
elem = elem.previousSibling;
} while ( elem && elem . nodeType != 1 );
return elem;
};

function next(elem) {
do {
elem = elem.nextSibling;
} while ( elem && elem . nodeType != 1 );
return elem;
}

function parents(elem, parents) { //查找当前祖先辈元素需要的节点如 parents(oDiv, 'dd') 查找 oDiv 的祖先元素为dd 的
if(!elem || !parents) return;
var parents = parents.toUpperCase();
do{
elem = elem.parentNode;
} while( elem.nodeName.toUpperCase() != parents );
return elem;
};