スマホサイトに使えるメニューの動きまとめ |
スマホサイトで使われているメニューの種類 ドロップダウンメニューやスライドメニューなど様々なメニューがあります。 どのようなメニューがあるかは、以下のサイトにまとめられています。 スマホのメニューデザインに悩んだらこれを見る 徹底収集36選！ ここでは、このようなメニューの動きを実装できるjQueryを紹介していきます。 ドロワーメニュー ドロワーメニュー（スライドメニュー）とは、画面の横から引き出しのように現れるメニューです。 スマホサイトの初期に流行りましたが、端末によって不具合が多かった気がします。 最新の機種では安定しているように思います。 ドロップダウンも組み合わせることができるので、メニューが多いときは使っています。 Drawer http://git.blivesta.com/drawer/ ドロワーメニューを実装する際には、とてもお世話になっているjQueryプラグイ
スマホのメニューデザインに悩んだらこれ！パターン別サンプル36選 | LISKUL
スマホはメニューバーが命！！ スマホでもっとも重要な動作は「タップ」ですが、その重要な役割を引き受けるのがメニューアイコンやリストです。 ユーザが求めるコンテンツにスムーズにつなげられるよう、最適化していくことが必要です。 ただそのデザイン、「なんとなく」のものになっていませんか？ 違和感なくスムーズにコンテンツにつなげるためには、最適なデザインを選択する必要があります。 今回は100のスマホサイトを調査し、その中で代表的な36サイトから7つのメニューデザインに分類し、まとめてみました。 自分のスマホサイトの性質を考えながら、もっとも適切なメニューを探していきましょう！ 100のスマホサイトから見る、 スマホメニューの人気ランキング 上図は、100のスマホサイトをランダムに抽出し、それぞれのサイトで採用されているメニューの割合を調査した結果になります。この結果によれば、一位が圧倒的な割合で
株式会社Go-Next | お客様にビジネスの成長と革新を
今日も生まれる感動と笑顔 お客様の事業、戦略、Webサイトの現状などを把握し、最適な施策を立案・実行します。 more info Top Message インターネットテクノロジーの需要が高まり、その必要性と可能性を感じ2005年に創業して以来、現在に至るまでステークホルダーの皆さまに支えていただきながら成長を続けてまいりました。「ITとクリエイティブのチカラで、心沸き起こるプロダクトを生み出す」ことをミッションに掲げ、さらなる充実したチカラ溢れる未来の実現を目指します。私たちの強みは、企画戦略からシステム開発、Webアプリケーション開発、クリエイティブ、コンサルティングに渡るワンストップソリューション提供とオーナーシップマインドを両立することにより、より精度の高い、顧客満足度の高いアウトプットと課題解決を達成します。また、創造性の向上、生産性の向上、コストの削減といった意識、文化を育むた
初心者でもすぐできるスマホ対応jQueryアコーディオンメニューの作り方 | SONICMOOV LAB
また会いましたな！ スイカバー(ふつうのやつ)をこよなく愛するマークアップエンジニアのまりぞーですヽ(°ω°)ﾉ 先日、ついにWii UとSplatoonをゲットしました。 そろそろガチバトルでわちゃわちゃするお年頃かもしれません…ガンバルゾー！ガンバルゾー！ 今回はjQueryを利用したアコーディオンメニューの作り方をご紹介します。 前回の【初心者向け】レスポンシブなtableを作ってみる同様、初心者向けです。 また、 来年2016年1月12日からIE8がサポート対象外となるので、対応ブラウザはIE9以降とモダンブラウザ系とします。 デモでは割りとシンプルな構造なので、スマホなどたいていの端末で閲覧できると思います。 よろしくお願いします。 PCのときは横並びのレイアウトで、モバイル端末など画面が小さい場合はぬるりと動くハンバーガーに格納されるjQueryでレスポンシブなメニューを作って
たった1行！スマホサイトのコーディング時に役立つ小技8（サンプルあり） - Design Color
もくじ 幅をデバイスサイズに合わせる スマホを横にしたときに文字が大きくならないようにする 電話番号に自動的にリンクが付かないようにする リンクを押したら電話をかけられるようにする リンクを押したらGoogleマップアプリを起動させる リンクエリアを広げる paddingやborder分を気にせずwidth/heightの数値を指定する 長い文字列でも途中で改行させる 1.幅をデバイスサイズに合わせる まずはスマホサイトを作るときの基本ですね。サイト幅をデバイスの幅に合わせてあげるには、以下の一行だけで対応出来ます。 <meta name="viewport" content="width=device-width,initial-scale=1.0"> サンプル 2.スマホを横にしたときに文字が大きくならないようにする スマホを横にすると、解像度が変化すると共に文字サイズも大きくなってし
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
iPhoneデザインボックス