平板电脑宽度中滑块导航的定位问题

Ste*_*vie 5 html css css3 media-queries

我正在完成这个网站的工作,并试图完成滑块导航的定位; 但是,我很难在大约平板电脑宽度屏幕(550px-768px)上获得正确的位置.

我认为我的媒体查询和大小调整有些问题,但是我无法理解为什么我无法锁定该范围之间的位置!

是指向正确行为的链接.有任何想法吗?

滑块使用Cycle2,如果重要的话!

示例HTML

<div id="slider" class="cycle-slideshow" data-cycle-pager="#adv-custom-pager" data-cycle-slides="> div" data-cycle-timeout="7000">

<div class="singleSlide">
<!-- content goes in here -->
</div>

<div id="sliderNav">

<div id="adv-custom-pager">
    <span class=""></span>
    <span class=""></span>
    <span class=""></span>
</div>

</div>
Run Code Online (Sandbox Code Playgroud)

和CSS

@media screen and (max-width: 768px) and (min-width: 550px) {
     #sliderNav {
     bottom:145px;
     }

     .slidercaption {
     height:250px;
     }
}
Run Code Online (Sandbox Code Playgroud)

小智 0

那时我看不出滑块有什么问题。

老实说,当我向网站添加滑块时,我通常会在手机上将其关闭,并且只有 1 个图像可见(以分解文本)。视点非常小,人们不会等待观察滑块的变化,这与台式机不同,因为他们可以在阅读其他内容时注意到它的变化。