1

对于我在使用 Nivo 7 JQuery 图像滑块时遇到的问题，我真的很感激。

- 我的网站是响应式的，我有单独的手机和桌面样式表 - 滑块在手机版本上运行良好，问题出现在我网站的桌面版本 *问题： *在第一张图片之后，滑块压缩了大约 15%，并且在所有其他图像中保持这种方式，即使它再次击中第一张图像。这些图像都是相同的尺寸（我已经检查了很多次）。这不是尺寸问题，滑块只是在出现的第一张图像之后覆盖了底部 15% 的图像。我已按照 nivo 7 网站上的指示复制了所有代码并附上了相关的样式表。

我不明白的是，它在我网站的手机版本中完美运行，但在桌面上却不行。手机和台式机之间的唯一区别是布局。在桌面上，我在滑块周围放置了一个 div 包装器，以将宽度限制为 59%，将高度限制为自动。#home1 部分​​仅声明宽度为 100%。下面是代码：

<div id="homeWrapper">
   <section id="home1">
    <div class="slider-wrapper theme-light">
<div id="slider" class="nivoSlider">
    <img src="pictures/home/MindBodySoulCafe.jpg" width="470" height="303" alt="Mind, Body, Soul     project Cafe perspective"> 
    <img src="pictures/home/MindBodySoulCAD.jpg" width="470" height="303" alt="floor plan     of       Mind, Body &amp; Soul"> 
    <img src="pictures/home/barkmaterials.jpg" width="470" height="303" alt="Materials used for Bark Media Project">
    <img src="pictures/home/modelstairs.jpg" width="470" height="303" alt="Construction model  for staircase">
    </div>
</div>
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider({
    effect: 'slideInLeft',
    pauseTime: 4000,
    pauseOnHover: true,
    startSlide: 0,
});
});
</script>
  </section>
  </div>

不幸的是，我目前无法访问 css 文件。

4

0 回答 0