画像CSSで右から左へスクロール

Question

私は10枚の画像を含むDIVを持っています。 JavaScriptを使わずにこのDIVの画像を右から左へスクロールしたいと思います。出来ますか？

ありがとうございます。

Answer 1

簡単な答えは：いいえ、純粋なCSSを使ってアニメーションを行うことはできません。 CSSのアニメーションや変形はカード上にありますが、まだ標準化されておらず、幅広くサポートされているわけでもありません。標準のCSSだけを使用していない

http://www.romancortes.com/blog/pure-css-coke-can/

賢い転がり/スクロール効果：

しかし、言った、あなたはこれを見ている必要があります。 JavaScriptなし、CSSアニメーションまたはトランスフォームなし。非常に賢い。 IE8でも動作します。

もちろん、これを達成するためには非常に卑劣なCSSトリックを使用しているので、毎日のコードで使用するテクニックではありません。しかし、問題は「それは可能ですか？」ではなく、「それは過度に巧妙でハッピーでなければ可能ですか？

Answer 2

いいえ、今のところCSSはアニメーションを処理できません。あなたのためにこれを処理するために何らかのjavascriptを含める必要があります。現在のフレームワークはすべてあなたのために重労働をしていますが、考えているほど複雑ではありません。私は個人的にjQuery http://jquery.com/を推奨しますが、他にもあります。あなたはhttp://plugins.jquery.com/

EDITそれを自分で作成する方法についてわからない場合は、あなたが必要な機能を与えるために、あなたのサイトにあなたのような問題を解決し、あなたがドロップすることができるはずのプラグインを作成している人がいます

いくつかのCSSアニメーションは可能ですが、一部のブラウザではサポートされないことを付け加えておきます。

Answer 3

http://www.the-art-of-web.com/css/css-animation/

検索のためのGoogleにクレジット:)

上記のコメントが言うように、これはCSS3であるあなたは、ブラウザ

Answer 4

のサポートに制限されているので、それはどのトランジションを使用することにより可能ですCSS3の機能なので、IEでは動作しません。しかし、ブラウザのリセットについては、ff3.6 +とchrome dunnoで動作しますが、テストする時間がありませんでした。

https://developer.mozilla.org/en/CSS/CSS_transitions

Answer 5

さて、あなただけwidthを固定画像を含むことDIVを与えるとCSSを経由してwhitespace: no-wrapを設定します。その後、divにoverflow: autoを追加してください。