0

我在使用 AnySlider 时遇到了一些问题，可以在这里找到任何 Slider 链接，我之前使用过这个没有太多麻烦。但是，今天，我注意到它仅在 Firefox 中正确定位。

IE、Safari 和 Chrome，它位于它需要的位置下方。

我的网站在这里：[链接到有问题的网站][2]

更新*** 它与功能区导航有关。我删除了它，它的位置正确****

我将在此处发布 html 代码：

<!-- AnythingSlider Begin -->
    $(window).resize(function(){
 $('#slider').height( $(window).width()/2.3 );
});

$(document).ready(function(){
    $('#slider').anythingSlider({
    theme           : 'metallic',
    autoPlay: true,
        delay: 5000,
        mode: 'fade',
        resizeContents: true,
easing          : 'easeInOutBack',
toggleArrows        : true,
toggleControls      : true, 
navigationFormatter : function(index, panel){
return [ 'Appetizers','Sandwhiches and more','Save room for dessert','Finish up in our giftshop' ] [index - 1];
}, 
onSlideComplete : function(slider){
// alert('Welcome to Slide #' + slider.currentPage);
                }
});//end function
});//end ready
</script>

和

<div id="containertop">
<div class="center">

<ul id="slider" >
        <li>
        <img src="http://www.barrowwebdesigns.com/templates/deli/images/potatoskins.jpg" title="Lemon Yogurt with Blueberry" alt="Lemon Yogurt with Blueberry"/>
        </li>
        <li>
        <img src="http://www.barrowwebdesigns.com/templates/deli/images/subs.jpg" title="Watermelon Lemonade Gelato" alt="Watermelon Lemonade Gelato"/>
        </li>
        <li>
        <img src="http://www.barrowwebdesigns.com/templates/deli/images/cake.JPG" title="Making Watermelon Lemonade " alt="Making Watermelon Lemonade"/>
        </li>
        <li>
        <img src="http://www.barrowwebdesigns.com/templates/deli/images/giftshop.JPG" title="Banana Pudding!"  alt="Banana"/>

        </li>



 </ul>
     </div> <!--end center-->   







    <div class="clear"></div>
<img src="http://www.barrowwebdesigns.com/templates/deli/images/paperbottom.jpg" alt="this isn't working" width="900px"  />
</div><!--end containertop -->

任何帮助，将不胜感激。我已经盯着这个看了一段时间了。 Firefox 中的屏幕

IE、Chrome、Safari 中的屏幕

4

2 回答 2

1

尝试overflow: hidden从此处移除（theme-metallic.css 第 237 行）：

.anythingSlider .anythingWindow {
overflow: hidden;
position: relative;
width: 100%;
height: 100%;
}
于 2013-06-11T23:07:39.793 回答
0

我猜它来自r-triangle-top和r-triangle-bottom，它们阻碍了你的滑块向下推。

尝试将它们设置在绝对位置或给它们一个负边距底部不挡路（您希望滑块设置的区域）。

Position:relative ，仅在屏幕上移动内容，但它们在文档流中保持其位置。（就像 IE 中的 transform 或一些 activex 一样）

于 2013-06-11T23:10:36.210 回答