如何修复由jQuery FlexSlider造成的水平滚动条？

jQuery FlexSlider导致水平滚动条在这里：http://abhinavsood.com/labs/grab/ 我试过overflow-x: hidden flex-container，但它似乎并没有解决它。如何修复由jQuery FlexSlider造成的水平滚动条？

任何人都可以看一看，并提出修复？

来源

2013-03-03 Abhinav Sood

.flex-direction-nav .flex-next { 
background-position: 100% 0; 
right: -36px; 
} 

.flex-direction-nav .flex-prev { 
left: -36px; 
}

删除left和right -36px，我没有看到你的页面上的任何箭头所以也许你可以删除那些elemnts内flex-direction-nav格

来源

2013-03-03 13:08:28 rmagnum2002

如果您不需要它们，您可以在第27行的scripts.js中设置directionNav：false，并且这应该正确地禁用箭头， – rmagnum2002 2013-03-03 13:18:15

在阅读您的答案后，我也会提醒您注意directionNav。谢谢@ magnum2002 :) – 2013-03-03 13:25:37

它实际上是你的.flex-direction-nav .flex-next锚，是造成它。

我通过应用right: 0;来修复它。

来源

2013-03-03 13:11:39

我设法用它编辑以下两两件事：在style.css中

线329加

overflow:hidden !important; 

.flexslider .slides > li { 
position:relative; 
overflow:hidden !important; 
}

，并在372至385

bottom:10px; left: 10px;overflow: hidden; 

.flexslider.position-caption-bottom-left .flex-caption{ 
bottom:10px; 
left: 10px; 
overflow: hidden; 
text-align:left; 

} 
.flexslider.position-caption-bottom-right .flex-caption { 
bottom:10px; 
left: 10px; 
overflow: hidden; 
text-align:right; 
} 
.flexslider.position-caption-bottom-centered .flex-caption { 
bottom:10px; 
left: 10px; 
overflow: hidden; 
text-align:center; 
}

来源

2014-01-28 08:44:56 Bodo

我设法的唯一途径修复这是我添加的选项：

useCSS: false

例如：

$('.flexslider').flexslider({ 
    animation: "slide", 
    useCSS: false 
    });

因为当它被设置为true元件ul.slides变宽1000％，并且使浏览器，使水平滚动条。

来源

2014-02-24 08:51:47 Maria

如何修复由jQuery FlexSlider造成的水平滚动条？

回答

相关问题