27929


画像スクローラにswiperを使っています。gemでswiper-railsというのがありそれでrailsに導入しました。  
動作するようになったのですが、デフォルトだと[![イメージ](https://i.stack.imgur.com/jWOJR.png)](https://i.stack.imgur.com/jWOJR.png)画像にhoverしたら矢印が現れるようにできません。デフォルトでは消しといてhoverしたら矢印が現れるようにできる方法をご存知の方いらっしゃいますでしょうか？

[code]

    .swiper-container
      .swiper-wrapper
        .swiper-slide
          = image_tag hoge.image1.url
        .swiper-slide
          = image_tag hoge.image2.url
        .swiper-slide
          = image_tag hoge.image3.url
      .swiper-pagination
      .swiper-button-prev.swiper-button-black
      .swiper-button-next.swiper-button-black
    
[/code]

javascript

[code]

    mySwiper = new Swiper('.swiper-container',
      direction: 'horizontal'
      loop: true
      autoplay: 5000
      autoResize: true
      calculateHeight: true
      pagination: '.swiper-pagination'
      paginationClickable: true
      nextButton: '.swiper-button-next'
      prevButton: '.swiper-button-prev'
    )
    
[/code]


CC BY-SA 3.0
2016-07-28T10:35:01.200
27916
2020-12-23T10:55:15.950
2020-12-23T10:55:15.950
32986
10851
question
javascript ruby-on-rails haml swiper
swiper矢印をhoverしたら現れるようにしたい


自己解決しました。

[code]

    .container-fluid .swiper-container:hover .swiper-button-prev.swiper-button-black {
      visibility: visible;
    }
    .container-fluid .swiper-container:hover .swiper-button-next.swiper-button-black {
      visibility: visible;
    }
    .swiper-button-prev.swiper-button-black,
    .swiper-button-next.swiper-button-black {
      visibility: hidden;
    }
    
[/code]


CC BY-SA 3.0
2016-07-29T02:16:33.317
27929
2016-07-29T02:16:33.317
10851
27916
answer