-
ID:OeOHrl さんの質問

スマホサイトにサイト内検索をつけたいと思っています。

検索ボタンを押すと検索窓が伸びて文字が入力できるようになる、というデザインにしたいのですが、下記のサイトを参考にcssのみで実装してみたところ、動きがカクカクしていました。
スムーズに動かしたいのですが、他に良い方法はないでしょうか。

http://webdesignerwall.com/tutorials/expandable-mobile-search-form

そもそも、スマホサイトでこういうデザインはよくないのかなあとも思い始めましたが…

みんなの回答 6 件

ID:MhoYY1 さんの回答

同時に動かす装飾を減らしてみたら?あと、動きの大きさに対して、Durationが長いとか。アルファを伴う処理は、アニメーションが重なると重くなるよ。
それはJSでやっても同じようなことにはなると思う。

ID:pULMzV さんの回答

CSSアニメーションはGPUアクセラレーションを使用しているため描画能力が高く、検証機種がよほどスペックが低くない限り(適切にコーディングできていれば)カクつくことはないはずです。
むしろCSS3に対応しているスマホサイトだからこそできるエフェクトだと思います。

ID:HWD0KS さんの回答

あたしこのタイプの検索嫌い。ふつうにしててよ

ID:HWD0KS

うごかしても意味がないものをうごかさないでよ。ましてや検索って結構大事でしょ。変なことしないで。

ID:kPaiC9

激しく同感

ID:wggx.b

同感だけど論点そこじゃなくね

ID:PvWnWa さんの回答

CSSアニメーション=GPUアクセラレーションの使用ではないので、GPUが動く書き方をしてみて。

ID:LQxRiT さんの回答

transitionのallを必要プロパティのみにする。
transitionのショートハンドを個別に設定する。
translateZ(0)とかでGPUを有効にする(iOSのみかな?)

これで改善しなかったらハードの問題かも。

ID:PvWnWa さんの回答

っていうか、アニメーションしなれければならない理由を述べよ

ID:kPaiC9

まずそこだよな

最終更新日:2014-02-18 (3,930 views)

関連するトピックス

ページ上部に戻る