こんにちは問題はページ下部のスライダーにあります。カルーセルは奇妙なことをしています。アニメーションを実行してから1秒も経たないうちに、現在のアイテムのすべての要素の幅が再計算されます。それはひどいように見えます、そしてCSSをチェックした後、私はまだそれを修正する方法を知りません。
何か考えはありますか?
こんにちは問題はページ下部のスライダーにあります。カルーセルは奇妙なことをしています。アニメーションを実行してから1秒も経たないうちに、現在のアイテムのすべての要素の幅が再計算されます。それはひどいように見えます、そしてCSSをチェックした後、私はまだそれを修正する方法を知りません。
何か考えはありますか?
ランディングページ.cssの下:
.content-carousel .container .carousel .carousel-inner .item { padding:0 5% }
これをオフにすると、問題が修正されました。これが問題を引き起こしている理由を正確に診断していませんが、カルーセルを1つか2つ書いているので、アイテムに%パディングを付けるのは悪い考えだと思いました。パディングが重要な場合は、ボックスサイズをボーダーボックスに設定してみてください。ただし、アイテムのラバーバンディングがなくなる以外は気づきませんでした。
@ErikReppenのコードはうまくいきませんでした。
良い解決策はありませんが、修正しました。ブートストラップのカルーセルの例を注意深く観察しましたhttp://twitter.github.com/bootstrap/javascript.html#carousel。
imgの幅はグリッドの幅よりも大きくする必要があることがわかりました。ではspan9
、幅は最大870ピクセルなので、870ピクセルより大きい画像を準備する必要があります。imgの外側にコンテナが多い場合は、すべてのコンテナに境界線または余白があるため、幅の狭い画像を使用できます。
http://twitter.github.com/bootstrap/javascript.html#carouselのように、div.span9とCarouselの間にあるため、幅830pxを使用できます。