vue实现电影选座代码

代码语言:html

所属分类:其他

代码描述:vue实现电影选座代码,选择座位,计算价格,包含已售和未售。

代码标签: 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