HTML 5学習小記十

1.複数のdivを水平方向の上位中央に表示する:height:50%;2.swiperの画像表示方向について://Slidesのスライド方向は、水平(horizontal)または垂直(vertical)を設定できます.

        
      var mySwiper = new Swiper ('.swiper-container', {
        direction: 'horizontal',//Slides     ，     (horizontal)   (vertical)。
            initialSlide :2, //      slide   。
    autoHeight: true, //       
  })        
  

3.swiperの自動ローテーション効果var mySwiper=new Swiper('.swiper-container',{autoplay:3000,speed:300,//再生回転アニメーション速度loop:true,////逆方向自動切替簡単例})4,swiperマウスで画像をキャプチャする際、ディスプレイビット:var mySwiper=new Swiper('.swiper-container',{grabCursor:true,}5.属性historyの説明slide切替時に交換URLとブラウザのhistoryを更新しない.state(pushState).これにより、slideごとに独自のURLが作成されます.historyを使用するには、slideに属性data-historyを追加する必要があります.例

    

        

            Slide 1
        

            Slide 2
        

            Slide 3

    


        var swiper = new Swiper('.swiper-container', {
            history: 'love',
        });
    

6.ピクチャマルチキャスト切り替えの効果slideの切り替え効果は、デフォルトでは「slide」(シフト切り替え)で、「fade」(フェード)「cube」(ブロック)「coverflow」(3 dストリーム)「flip」(3 d反転)に設定できます.

  :slide     ，   "slide"（    ），    "fade"（  ）"cube"（  ）"coverflow"（3d ）"flip"（3d  ）。
effect : 'coverflow',

7.swiperのいくつかのクリックイベントclicks;preventClicks:swiperがタッチしている間にデフォルトイベント(preventDefault)をブロックし、タッチしている間にリンクジャンプをトリガーすることを防止します.preventClicksPropagation:slideをスライドするとイベントがトリガーされます.

 
var mySwiper = new Swiper('.swiper-container',{
preventLinksPropagation : false,
})

 
 
slideToClickedSlide:     ,    slide        true    false
 
 
http://www.swiper.com.cn/api/basic/2016/1029/317.html swiper