1. <section class="h_custom_data wyj_zdy_wrap" templetid="28150057" data-title="双12大牌页面-v20211128"
    2.     edit-time="2021-11-28 15:00:57" code-author="wangyongjie">
    3.     <link rel="stylesheet"
    4.         href="https://prom.m.gome.com.cn/html/prodhtml/channel/resource/4530/8890709744/swiper.min.css">
    5.     <script
    6.         src="https://prom.m.gome.com.cn/html/prodhtml/channel/resource/4530/6288084257/wyj_custom_price.js"></script>
    8.     <style>
    9.         .wyj_dp_djdj {
    10.             display: block;
    11.             width: 7.5rem;
    12.             height: 3.0467rem;
    13.         }
    15.         .wyj_dp_djdj .swiper-slide {
    16.             width: 7.1rem;
    17.             height: 3.0467rem;
    18.             background-size: 100% 100%;
    19.         }
    21.         .swiper-container-horizontal-wzj>.swiper-pagination-bullets,
    22.         .swiper-pagination-custom,
    23.         .swiper-pagination-fraction {
    24.             bottom: 0.2rem;
    25.             left: -0.16rem;
    26.             width: 100%;
    27.             top: 2.35rem;
    28.         }
    30.         .wyj_dp_djdj .swiper-slide>div {
    31.             width: 87%;
    32.             height: 100%;
    33.             background-size: 100% 100%;
    34.             margin-left: 0.32rem;
    35.         }
    37.         .wyj_dp_djdj a {
    38.             display: block;
    39.             width: 100%;
    40.             height: 100%;
    41.         }
    43.         .wyj_dp_djdj .swiper-pagination-bullet {
    44.             background-color: transparent;
    45.             border: .01rem solid #764EA2;
    46.             opacity: 1
    47.         }
    49.         .wyj_dp_djdj span.swiper-pagination-bullet.swiper-pagination-bullet-active {
    50.             background-color: #764EA2 !important;
    51.         }
    52.     </style>
    54.     <div class="swiper-container wyj_dp_djdj swiper-container-initialized swiper-container-horizontal-wzj">
    55.         <div class="swiper-wrapper">
    56.             <div class="swiper-slide">
    57.                 <div style="background-image:url(https://gfs7.gomein.net.cn/wireless/T11RYkBsJT1RCvBVdK_950_471.png);">
    58.                     <a href="https://item.m.gome.com.cn/p-pop8016768348.html"></a>
    59.                 </div>
    60.             </div>
    61.             <div class="swiper-slide">
    62.                 <div style="background-image:url(https://gfs5.gomein.net.cn/wireless/T1VzdkBCAT1RCvBVdK_950_471.png);">
    63.                     <a href="https://item.m.gome.com.cn/p-pop8016898401.html"></a>
    64.                 </div>
    65.             </div>
    66.             <div class="swiper-slide">
    67.                 <div style="background-image:url(https://gfs8.gomein.net.cn/wireless/T1izdkB4WT1RCvBVdK_950_471.png);">
    68.                     <a href="https://item.m.gome.com.cn/p-pop8016824571.html"></a>
    69.                 </div>
    70.             </div>
    71.             <div class="swiper-slide">
    72.                 <div style="background-image:url(https://gfs7.gomein.net.cn/wireless/T1.FYkB4YT1RCvBVdK_950_471.png);">
    73.                     <a href="https://item.m.gome.com.cn/p-pop8016926678.html"></a>
    74.                 </div>
    75.             </div>
    77.         </div>
    78.         <div class="swiper-pagination swiper-pagination-bullets-wzj"><span
    79.                 class="swiper-pagination-bullet swiper-pagination-bullet-active"></span><span
    80.                 class="swiper-pagination-bullet"></span><span class="swiper-pagination-bullet"></span></div>
    81.         <span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>
    82.     </div>
    83.     <script>
    84.         var swiperJs = document.createElement("script");
    85.         swiperJs.src = "https://prom.m.gome.com.cn/html/prodhtml/channel/resource/4530/8890709744/swiper.min.js";
    86.         document.body.appendChild(swiperJs);
    87.         swiperJs.onload = function () {
    88.             var wyj_dp_swiper = new Swiper('.wyj_dp_djdj', {
    89.                 watchSlidesProgress: true,
    90.                 resistanceRatio: 0,
    91.                 loop: true,
    92.                 centeredSlides: true,
    93.                 loopAdditionalSlides: 300,
    94.                 speed: 1000,
    95.                 pagination: {
    96.                     el: '.swiper-pagination',
    98.                 },
    99.                 autoplay: {
    100.                     delay: 2200,
    101.                     disableOnInteraction: false,
    102.                 },
    103.                 on: {
    104.                     init: function () {
    105.                         slides = this.slides
    106.                         for (i = 0; i < slides.length; i++) {
    107.                             slide = slides.eq(i)
    108.                             slide.css('zIndex', 100 - i);
    109.                         }
    110.                     },
    111.                     resize: function (swiper) {
    112.                         swiper.update()
    113.                     },
    114.                     setTranslate: function () {
    115.                         slides = this.slides
    116.                         offsetAfter = this.width * .96
    117.                         for (i = 0; i < slides.length; i++) {
    118.                             slide = slides.eq(i)
    119.                             progress = slides[i].progress
    120.                             if (progress <= 0) {
    121.                                 slide.transform('translate3d(' + (progress) * offsetAfter + 'px, 0, 0) scale(' + (1 - Math.abs(progress) / 20) + ')');
    122.                                 slide.css('opacity', (progress + 4));
    123.                             }
    124.                             if (progress > 0) {
    125.                                 slide.css('opacity', 1 - progress);
    126.                             }
    127.                         }
    128.                     },
    129.                     setTransition: function (swiper, transition) {
    130.                         for (var i = 0; i < this.slides.length; i++) {
    131.                             var slide = this.slides.eq(i)
    132.                             slide.transition(transition);
    133.                         }
    134.                     },
    135.                 },
    136.             });
    137.         }
    138.     </script>
    139. </section>
    140. <script src="https://prom.m.gome.com.cn/html/prodhtml/channel/resource/4530/8890709744/swiper.min.js"></script>