vue实现电影选座代码
代码语言:html
所属分类:其他
代码描述:vue实现电影选座代码,选择座位,计算价格,包含已售和未售。
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vue@2.6.1-dev.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/layer.js"></script>
<style type="text/css">
html,
body {
margin: 0;
padding: 0;
height: 100%;
}
#app div {
/* border: 1px solid black; */
float: left;
}
#room {
/* width: 300px; */
width: 60%;
border: 1px solid black;
padding: 20px 20px 20px 20px;
}
.sit {
height: 35px;
width: 35px;
min-height: 10px;
min-width: 10px;
margin: 4px 4px 4px 4px;
background-size: cover;
/* border: 1px solid black; */
}
/* 座位 */
.bg-sit {
background-image: url('//repo.bfw.wiki/bfwrepo/icon/65fa7c1d0e399.png');
}
.bg-sit:hover {
cursor: pointer;
}
/* 已售座位 */
.bg-sited {
/* background-color: red; */
background-image: url('//repo.bfw.wiki/bfwrepo/icon/65fa7c34c8a6a.png');
}
/* 空位置 */
.bg-nosit {
/* border: 1px solid white; */
}
/* 已选座位 */
.bg-temp {
cursor: pointer;
background-image: url('//repo.bfw.wiki/bfwrepo/icon/65.........完整代码请登录后点击上方下载按钮下载查看
网友评论0