サクサク読めて、アプリ限定の機能も多数!
2014年上半期、チェックしておきたいUIデザインをDribbbleから紹介します。 各アートワークは大きいサイズの画像やPSDをダウンロードできるので、気になったものはリンク先をチェックしてみてください。 アートワークにはアニメーションgifも多いのですが、ページサイズが大変なことになるため最初の一つだけです、アニメーションはリンク先で。
スクリプトは一切使用せず、デスクトップ時はタブコンテンツ、スマフォ・タブレット時はタブをスケールダウンに変更してコンテンツを表示するスタイルシートのテクニックを紹介します。 単にレスポンシブ対応のタブというだけでなく、コンテンツの切替やタブのホバーエフェクトなど、非常に完成度の高いタブコンテンツに仕上がっています。 スケールダウンの仕組み 実装はこんな感じになります。 HTML まずは上部のコントローラー、このラジオボタンで各タブの動きを制御します。 デザインを変更して利用したり、タブのみにしたい場合は非表示にするのも有りですね。 <!-- TAB CONTROLLERS --> <input id="panel-1-ctrl" class="panel-radios" type="radio" name="tab-radios" checked> <input id="panel-2-c
ランキング
お知らせ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く