2016-05-20 9 views
1

スムーズにメニューを移行したいと思います。問題は、矢印をクリックすると2番目のdivが1番目のdivの最後に表示され、見た目が滑らかにならないことです。 plsは私のコードについては、以下を参照してください。CSS:水平スクロールメニューの遷移がスムーズでない

Plsのは、ここに私のコードを参照してください:あなたはCSSでのいくつかの基本的な変更を行う必要があり、あなたのコード内の http://www.codeply.com/go/mdMPOkmFVH

+0

興味深い質問でした。 C. –

答えて

0

ここ
.btn-arrow { 
    display: inline-block; 
    text-align: center; 
} 
.effects-list { 
    text-align: center; 
} 
.col-xs-4 { 
    min-height:20px; 
} 

を次のように、あなたのCSSはする必要があります背後に理由があるのは、jquery関数が位置を絶対にするようにスライディング要素を設定する必要があり、それを相対的な力で設定していたからです。 div内のすべての子要素が絶対要素である場合、絶対要素は親divのスペースを取得しないため、親divの取得コンテンツは空になります。空のdivとして扱い、高さを0pxに設定し、divに何も表示しません。ここでは問題を解決するための最小の高さを指定しています。

もう1つのことは、親のdivにホワイトスペースを追加することです。

<div class="col-xs-4" id="effects_menu">&nbsp;</div> 
+0

こんにちは、どうもありがとうございます。私はあなたが投稿したことをやってみました。しかし、メニューのdivはPrevとNextリンクとインラインではありません。私はそれがインラインであることを望む。 –

+1

ああ、私は混乱してしまった。私はポジションを取った:相対的な、それは今働いている:)ありがとうございました! –

+0

@ R.C。乾杯、私はjsfiddleを追加することを忘れていました。 –

関連する問題