chenzimin2
/
shajiabin


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
							<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script src="./info.js"></script>
    <script>
      document.title = titleInfo;
    </script>
    <script src="./js/vue.min.js"></script>
    <!-- Swiper JS -->
    <script src="./js/swiper-bundle.min.js"></script>
    <link rel="stylesheet" href="./css/swiper-bundle.min.css" />
    <style>
      html,
      body {
        position: relative;
        height: 100%;
      }
      #app {
        width: 100%;
        height: 100%;
        background: #eee;
        font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        color: #000;
        margin: 0;
        padding: 0;
      }

      body {
        background: #eee;
        font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
        font-size: 14px;
        color: #000;
        margin: 0;
        padding: 0;
      }

      .swiper {
        width: 100%;
        height: 100%;
      }

      .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
      }

      .swiper-slide img {
        display: block;
        /* width: 100%; */
        height: 100%;
        /* object-fit: cover; */
      }
    </style>
  </head>
  <body>
    <div id="app">
      <div class="swiper mySwiper">
        <div class="swiper-wrapper">
          <div class="swiper-slide">
            <img :src="`./images/${number}.jpg`" alt="" />
          </div>
        </div>
        <!-- <div class="swiper-button-next"></div>
        <div class="swiper-button-prev"></div> -->
        <div class="swiper-pagination"></div>
      </div>
    </div>

    <script>
      var app = new Vue({
        el: "#app",
        data() {
          return {
            title: "2d",
            number: 0,
            name: "",
          };
        },
        mounted() {},
        created() {
          var mySwiper = new Swiper(".swiper", {
            direction: "vertical", // 垂直切换选项
            loop: true, // 循环模式选项

            // 如果需要分页器
            pagination: {
              el: ".swiper-pagination",
            },

            // 如果需要前进后退按钮
            // navigation: {
            //   nextEl: ".swiper-button-next",
            //   prevEl: ".swiper-button-prev",
            // },
          });
          // 创建一个URLSearchParams对象
          let params = new URLSearchParams(window.location.search);

          // 获取参数值
          let paramValue = params.get("m");
          this.number = paramValue;
          this.name = objInfo2d[paramValue];
          console.log(objInfo2d[paramValue], this.number);
        },
      });
    </script>
  </body>
</html>