模态框

5 years ago · 8a2e6f4b84
parent bac9030361
commit 8a2e6f4b84
4 changed files with 34 additions and 130 deletions
--- a/frontend/views/common/index.php
+++ b/frontend/views/common/index.php
@ -13,7 +13,7 @@
    <link href="/assets/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="/assets/css/animate.css" rel="stylesheet">
    <link href="/assets/css/style.css?v=4.1.0" rel="stylesheet">
-    <link href="/assets/css/popUps.css" rel="stylesheet">
+    <link href="/assets/css/model.css" rel="stylesheet">
 </head>
 <body class="fixed-sidebar full-height-layout gray-bg" style="overflow:hidden">
 <div id="wrapper">
@ -170,7 +170,7 @@
 <!-- 自定义js -->
 <script src="/assets/js/hplus.js?v=4.1.0"></script>
 <script type="text/javascript" src="/assets/js/contabs.js"></script>
-<script src="/assets/js/popUps.js"></script>
+<script src="/assets/js/model.js"></script>
 <!-- 第三方插件 -->
 <script src="/assets/js/plugins/pace/pace.min.js"></script>
 </body>
--- a/frontend/web/assets/css/popUps.css
+++ b/frontend/web/assets/css/popUps.css
@ -1,96 +0,0 @@
-.model_wrap{
-    width: 100%;
-    height: 100vh;
-    background-color: #000;
-    opacity: 0.5;
-    position: fixed;
-    top: 0;
-    display:none;
-    z-index:2001;
-}
-.unchoose{
-    display: none;
-}
-.model-bg{
-    width: 560px;
-    position: absolute;
-    top: 30%;
-    left: 60%;
-    color:#fff;
-    margin-left: -600px;
-    z-index:2002 ;
-}
-.content{
-    font-size:20px;
-}
-.jump{
-    cursor: pointer;
-    position:absolute;
-    width:80px;
-    font-size:16px;
-    color:coral;
-    padding: 10px 20px;
-    border-radius: 40px;
-    top:22%;
-    left:53%;
-    z-index: 2002;
-    text-align: center;
-    border: 2px solid coral;
-    transition: background-color .3s
-}
-.jump:hover{
-    background-color: coral;
-    color:#fff;
-}
-.Previous{
-    cursor: pointer;
-    width:100px;
-    text-align: center;
-    font-size:16px;
-    color:#1ecd97;
-    padding: 10px 20px;
-    border-radius: 40px;
-    margin-top: 20px;
-    border: 2px solid #1ecd97;
-    transition: background-color .3s
-}
-.Previous:hover{
-    background-color: #1ecd97;
-    color:#fff;
-}
-.nextPage{
-    cursor: pointer;
-    width: 100px;
-    font-size:16px;
-    color:#1ecd97;
-    padding: 10px 20px;
-    border-radius: 40px;
-    text-align: center;
-    margin-top:-46px;
-    margin-left:150px;
-    border: 2px solid #1ecd97;
-    transition: background-color .3s
-}
-.nextPage:hover{
-    background-color: #1ecd97;
-    color:#fff;
-}
-.point1{
-    width: 525px;
-    height:174px;
-    background:url("../img/prompt.png") no-repeat center/cover;
-    position:absolute;
-    left:-548px;
-    top:-110px;
-}
-.point2{
-    width: 529px;
-    height:170px;
-    background:url("../img/prompt3.png") no-repeat center/cover;
-    position:absolute;
-    left:-548px;
-    top:17px;
-}
-.boo{
-    border:5px solid #fff;
-}
--- a/frontend/web/assets/js/model.js
+++ b/frontend/web/assets/js/model.js
@ -0,0 +1,32 @@
+$(function(){
+    $(".prompt").click(function(){
+        $(".model_wrap").show();
+        $(".model-bg").eq(0).removeClass("unchoose");
+        $('.jump').removeClass('unchoose');
+        $('#side-menu').addClass('boo');
+    });
+
+    $(".model-bg").each(function (i) {
+        var _that=$(this);
+        _that.find(".nextPage").click(function () {
+            _that.addClass("unchoose");
+            $(".model-bg").eq(i+1).removeClass("unchoose");
+            $(".")
+        });
+        _that.find(".Previous").click(function () {
+            _that.addClass("unchoose");
+            $(".model-bg").eq(i-1).removeClass("unchoose");
+        });
+    });
+
+    $(".perfection").click(function () {
+        $(".jump").addClass('unchoose');
+        $(".model_wrap").hide();
+    });
+
+    $(".jump").click(function () {
+        $(this).addClass('unchoose');
+        $(".model_wrap").hide();
+        $(".model-bg").addClass("unchoose");
+    });
+});
--- a/frontend/web/assets/js/popUps.js
+++ b/frontend/web/assets/js/popUps.js
@ -1,32 +0,0 @@
-$(function(){
-    $(".prompt").click(function(){
-        $(".model_wrap").show();
-        $(".model-bg").eq(0).removeClass("unchoose");
-        $('.jump').removeClass('unchoose');
-        $('#side-menu').addClass('boo');
-    });
-
-    $(".model-bg").each(function (i) {
-        var _that=$(this);
-        _that.find(".nextPage").click(function () {
-            _that.addClass("unchoose");
-            $(".model-bg").eq(i+1).removeClass("unchoose");
-            $(".")
-        });
-        _that.find(".Previous").click(function () {
-            _that.addClass("unchoose");
-            $(".model-bg").eq(i-1).removeClass("unchoose");
-        });
-    });
-
-    $(".perfection").click(function () {
-        $(".jump").addClass('unchoose');
-        $(".model_wrap").hide();
-    });
-
-    $(".jump").click(function () {
-        $(this).addClass('unchoose');
-        $(".model_wrap").hide();
-        $(".model-bg").addClass("unchoose");
-    });
-});