Swiper中文论坛

标题: 求解!在线等!用切换效果coverflow时div的width被强制重置了! [打印本页]

作者: Lurker    时间: 2015-6-6 23:23
标题: 求解!在线等!用切换效果coverflow时div的width被强制重置了!
求解!在线等!
用切换效果coverflow时div的width被强制重置了!!!!


这个怎么办?我需要按照我自己的width来设置div
求大神帮忙解答。。。。
下面是代码:
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="utf-8">
  5.     <title>Swiper demo</title>
  6.     <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">

  7.     <!-- Link Swiper's CSS -->
  8.     <link rel="stylesheet" href="../dist/css/swiper.min.css">

  9.     <!-- Demo styles -->
  10.     <style>
  11.     body {
  12.         background: #fff;
  13.         font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
  14.         font-size: 14px;
  15.         color:#000;
  16.         margin: 0;
  17.         padding: 0;
  18.     }
  19.     .swiper-container {
  20.         width: 1024px;
  21.         border:1px solid red;
  22.         padding-top: 50px;
  23.         padding-bottom: 50px;
  24.     }
  25.     .swiper-slide {
  26.         background-position: center;
  27.         background-size: cover;
  28.         width: 500px;
  29.         height: 300px;
  30.         border:1px solid red;

  31.     }
  32.     </style>
  33. </head>
  34. <body>
  35.     <!-- Swiper -->
  36.     <div class="swiper-container">
  37.         <div class="swiper-wrapper">
  38.             <div class="swiper-slide"></div>
  39.             <div class="swiper-slide"></div>
  40.             <div class="swiper-slide"></div>
  41.         </div>
  42.         <!-- Add Pagination -->
  43.         <div class="swiper-pagination"></div>
  44.     </div>

  45.     <!-- Swiper JS -->
  46.     <script src="../dist/js/swiper.min.js"></script>

  47.     <!-- Initialize Swiper -->
  48.     <script>
  49.     var swiper = new Swiper('.swiper-container', {
  50.         pagination: '.swiper-pagination',
  51.         effect: 'coverflow',
  52.         grabCursor: true,
  53.         centeredSlides: true,
  54.         slidesPerView:3,
  55.         coverflow: {
  56.             rotate: 50,
  57.             stretch:200,
  58.             depth: 100,
  59.             modifier: -1,
  60.             slideShadows : true
  61.         }
  62.     });
  63.     </script>
  64. </body>
  65. </html>
复制代码



作者: chen1110103    时间: 2015-6-7 22:51
试试这样 slidesPerView:‘auto’,
作者: cock1993    时间: 2015-9-23 03:31
相同的情况,用所谓的强制width也不行。
用auto的slidesperview网格分布更离谱,几乎永远自动为1.然后吧width重置成页面宽度。
作者: cock1993    时间: 2015-9-23 03:31
chen1110103 发表于 2015-6-7 22:51
试试这样 slidesPerView:‘auto’,

没点到回复。也看下我说的吧。
作者: 凉凉凉    时间: 2016-11-21 11:06
slidesPerView: 1.7,刚刚解决了,总宽度除以图片宽度




欢迎光临 Swiper中文论坛 (http://bbs.swiper.com.cn/) Powered by Discuz! X3.2