Bläddra i källkod

增加广告弹窗内容

outaozhen 3 år sedan
förälder
incheckning
2a706609df

+ 25 - 4
home.html

@@ -440,6 +440,28 @@
     </div>
     </i>
   </div>
+
+  <!-- 广告弹窗 -->
+  <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="advert" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered modal-midell-dialog">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="advert">新版上线通知</h5>
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span aria-hidden="true">&times;</span>
+          </button>
+        </div>
+        <div class="modal-body">
+          <div class="mb-3"><img src="home/images/大司空2.0上线弹窗01.jpg"></div>
+          <p>如想访问旧版程序,请访问:<a href="https://yun2old.smartcost.com.cn/">https://yun2old.smartcost.com.cn/</a></p>
+        </div>
+        <!-- <div class="modal-footer">
+          <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
+          <button type="button" class="btn btn-primary">Save changes</button>
+        </div> -->
+      </div>
+    </div>
+  </div>
   <!-- JS. -->
   <script src="home/js/jquery/jquery-3.2.1.min.js"></script>
   <script src="home/js/bootstrap/bootstrap.min.js"></script>
@@ -506,12 +528,11 @@
       document.documentElement.scrollTop = 0;
     }
     // 滚动条到顶部的垂直高度
-    console.log($(window).scrollTop());
+    // console.log($(window).scrollTop());
     // 浏览器显示区域(可视区域)的高度
-    console.log($(window).height());
+    // console.log($(window).height());
     // 获取页面的文档高度
-    console.log($('.productOne').offset().top);
-    console.log();
+    // console.log($('.productOne').offset().top);
   </script>
 </body>
 

+ 11 - 1
home/css/styles.css

@@ -333,7 +333,7 @@ body {
 	width: 224px;
 	height: 224px;
 }
-.show {
+.showCartoon {
 	transform: translateY(0px) !important;
 	-webkit-transition-timing-function: ease-in-out;
 	transition-timing-function: ease-in-out;
@@ -746,3 +746,13 @@ body {
 .iconTop {
 	background: url(img/css_sprites.png) no-repeat -208px -1072px;
 }
+@media (min-width: 576px){
+	.modal-dialog.modal-midell-dialog{
+		width: 595px !important;
+		max-width: 595px !important;
+	}
+}
+/*.modal.show .modal-midell-dialog{
+	width: 595px !important;
+	max-width: 595px !important;
+}*/

BIN
home/images/大司空2.0上线-广告条.jpg


BIN
home/images/大司空2.0上线弹窗01.jpg


BIN
home/images/大司空2.0上线弹窗02.jpg


+ 7 - 6
home/js/global.js

@@ -1,4 +1,5 @@
 $(function(){
+  $('#exampleModal').modal('show')
 	$(".zhzdFir").click(function () {
 		$(this).toggleClass("now").siblings(".zhzdMenu").slideToggle("fast")
 	});
@@ -12,19 +13,19 @@ $(window).scroll(function () {
   // 	$('.bannerTitle1,.bannerTitle2,.bannerTitle3,.btnHand').removeClass('show');
   // }
   if (fold > $(".productOne").offset().top || $(window).scrollTop() < 2000) {
-  	$('.productOneImg,.productOneRImg,.productRT').addClass('show');
+  	$('.productOneImg,.productOneRImg,.productRT').addClass('showCartoon');
   }if($(window).scrollTop() > 2500 || fold < $(".productOne").offset().top){
-  	$('.productOneImg,.productOneRImg,.productRT').removeClass('show');
+  	$('.productOneImg,.productOneRImg,.productRT').removeClass('showCartoon');
   }
   if (fold > $(".productTwo").offset().top || $(window).scrollTop() < 3000) {
-  	$('.productOneImg,.productTwoImg,.productTwoRImg1,.productTwoRImg2,.productTwoRImg3').addClass('show');
+  	$('.productOneImg,.productTwoImg,.productTwoRImg1,.productTwoRImg2,.productTwoRImg3').addClass('showCartoon');
   }if($(window).scrollTop() > 3500 || fold < $(".productTwo").offset().top){
-  	$('.productTwoImg,.productTwoRImg1,.productTwoRImg2,.productTwoRImg3').removeClass('show');
+  	$('.productTwoImg,.productTwoRImg1,.productTwoRImg2,.productTwoRImg3').removeClass('showCartoon');
   }
   if (fold > $(".productThree").offset().top || $(window).scrollTop() < 4000) {
-  	$('.productThreeImg,.productThreeRImg1,.productThreeRImg2').addClass('show');
+  	$('.productThreeImg,.productThreeRImg1,.productThreeRImg2').addClass('showCartoon');
   }if($(window).scrollTop() > 4300 || fold < $(".productThree").offset().top){
-  	$('.productThreeImg,.productThreeRImg1,.productThreeRImg2').removeClass('show');
+  	$('.productThreeImg,.productThreeRImg1,.productThreeRImg2').removeClass('showCartoon');
   }
 })