• <i id="kju4x"></i>
    1. 如果瀏覽器不支持Flash播放插件該怎么辦?

      CMS建站 admin 發布時間:2024-03-06 10:51:08 瀏覽:

       我們都知道現在很多瀏覽器都不自動支持Flash播放器了,這樣導致網頁打開后幻燈片無法播放了。出現下面的情況了。

      nosupport.png

      出現這樣的問題怎么辦呢?如果讓客戶在瀏覽器上再去安裝播放器插件,就很麻煩,很多客戶也不太會操作。那我們設計這個網頁的時候應該如何處理呢?

      別著急,馬上安排?。?!  

      我們可以利用swiper這個萬能播放器來播放我們的幻燈片。下載地址

      https://swiper.com.cn/download/index.html#file1

      然后利用這個插件來播放我們的幻燈。

      下面以帝國cms為例,在首頁上如何實現swiper幻燈的效果。下面是具體的步驟:

      1.在swiper官方頁面下載最新的swiper壓縮包,大概是版本是11.0.3,下載解壓后,有個swiper目錄。然后把整個目錄上傳到網站的 skin 目錄下。

      2.然后在首頁模板中引入css和js文件

      <link rel="stylesheet" href="/skin/swiper/swiper-bundle.min.css" />

      <script src="/skin/swiper/swiper-bundle.min.js"></script>

      3.然后是幻燈代碼如下:

        <!-- Swiper -->

        <div class="swiper mySwiper">

          <div class="swiper-wrapper">

       

      [e:loop={"2",4,0,1}]

       

      <div class="swiper-slide">

      <a href="<?=$bqr[titleurl]?>" target="_blank">

      <img src="<?=$bqr[titlepic]?>" alt="<?=$bqr[title]?>">

      </a>

      </div>

       

      [/e:loop]

      <!--

            <div class="swiper-slide">Slide 1</div>

            <div class="swiper-slide">Slide 2</div>

            <div class="swiper-slide">Slide 3</div>

            <div class="swiper-slide">Slide 4</div>

            <div class="swiper-slide">Slide 5</div>

            <div class="swiper-slide">Slide 6</div>

            <div class="swiper-slide">Slide 7</div>

            <div class="swiper-slide">Slide 8</div>

            <div class="swiper-slide">Slide 9</div>

      -->

       

          </div>

          <div class="swiper-button-next"></div>

          <div class="swiper-button-prev"></div>

          <div class="swiper-pagination"></div>

        </div>

       

        <!-- Swiper JS -->

        <script src="/skin/swiper/swiper-bundle.min.js"></script>

       

        <!-- Initialize Swiper -->

        <script>

          var swiper = new Swiper(".mySwiper", {

            //spaceBetween: 30,

        //direction: 'vertical', // 垂直切換選項

        loop: true, // 循環模式選項

        autoplay:true,//等同于以下設置

            centeredSlides: true,

       

            pagination: {

              el: ".swiper-pagination",

              clickable: true,

            },

            navigation: {

              nextEl: ".swiper-button-next",

              prevEl: ".swiper-button-prev",

            },

          });

        </script>

       

      這樣就可以啦。

       

       

       

      在線咨詢

      點擊這里給我發消息售前咨詢專員

      點擊這里給我發消息售后服務專員

      在線咨詢

      免費通話

      24h咨詢:0475-2793529


      如您有問題,可以咨詢我們的24H咨詢電話!

      免費通話

      微信掃一掃

      微信聯系
      返回頂部
      波多野结衣高清无码中文观看_国产成人精品a视频一区_中文字幕久久免费福利片_亚洲无码大片在线观看