jquery.seat-charts实现电影院位置选座代码

代码语言:html

所属分类:其他

代码描述:jquery.seat-charts实现电影院位置选座代码

代码标签: jquery seat-charts 电影院 位置 选座 代码

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
   
<meta charset="UTF-8">
   
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" />

   
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.1.11.min.js"></script>
   
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/jquery.seat-charts.css">
 
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.seat-charts.js"></script>
   
<style>
body
{
       
font-family: 'Lato', sans-serif;
}
a
{
       
color: #b71a4c;
}
.front-indicator {
       
width: 145px;
       
margin: 5px 32px 15px 32px;
       
background-color: #f6f6f6;      
       
color: #adadad;
       
text-align: center;
       
padding: 3px;
       
border-radius: 5px;
}
.wrapper {
       
width: 100%;
       
text-align: center;
}
.container {
       
margin: 0 auto;
       
width: 500px;
       
text-align: left;
}
.booking-details {
       
float: left;
       
text-align: left;
       
margin-left: 35px;
       
font-size: 12px;
       
position: relative;
       
height: 401px;
}
.booking-details h2 {
       
margin: 25px 0 20px 0;
       
font-size: 17px;
}
.booking-details h3 {
       
margin: 5px 5px 0 0;
       
font-size: 14px;
}
div
.seatCharts-cell {
       
color: #182C4E;
       
height: 25px;
       
width: 25px;
       
line-height: 25px;
       
}
div
.seatCharts-seat {
       
color: #FFFFFF;
       
cursor: pointer;        
}
div
.seatCharts-row {
       
height: 35px;
}
div
.seatCharts-seat.available {
       
background-color: #B9DEA0;

}
div
.seatCharts-seat.available.first-class {
/*      background: url(vip.png); */
       
background-color: #3a78c3;
}
div
.seatCharts-seat.focused {
       
background-color: #76B474;
}
div
.seatCharts-seat.selected {
       
background-color: #E6CAC4;
}
div
.seatCharts-seat.unavailable {
       
background-color: #472B34;
}
div
.seatCharts-container {
       
border-right: 1px dotted #adadad;
       
width: 200px;
       
padding: 20px;
       
float: left;
}
div
.seatCharts-legend {
       
padding-left: 0px;
       
position: absolute;
       
bottom: 16px;
}
ul
.seatCharts-legendList {
       
padding-left: 0px;
}
span
.seatCharts-legendDescription {
       
margin-left: 5px;
       
line-height: 30px;
}
.checkout-button {
       
display: block;
       
margin: 10px 0;
       
font-size: 14px;
}
#selected-seats {
       
max-height: 90px;
       
overflow-y: scroll;
       
overflow-x: none;
       
width: 170px;
}
   
</style>
</head>

<bo.........完整代码请登录后点击上方下载按钮下载查看

网友评论0