コピペ１発+αではてなブログスマホ画面にトグルメニューをつけるカスタマイズ - Yukihy Life
6/22追記：コピペコードを１つにしました。前回のようにheaderにjQueryを読ませるより、若干スピードが速くなります。またデザイン面でもバランスが悪かったので少しコードを変更しました。その他のカスタマイズも充実させました。 8/7追記：ボタンの反応するところが横幅いっぱいになっていたので、文字の部分のみに修正しました。具体的には24行目を「block」→「inline-block」にしただけなので、今までのから変えたい方はそこのみ変えてください。また、その他のカスタマイズに「ボタンを目立たせる」と「２分割にする」を追加しました。 12/07追記：この記事に書かれているコードだと、「タイトル下」に広告を貼ったときに背景に色がついてしまします。気になる方は、（【改良版】コピペ一発はてなブログにトグルメニューをつけるカスタムを広告の背景に色がつかないようにしました！ - Yukihy L
jQueryでスマホ向けドロップダウンメニューを作る - Qiita
<header>は画面上部に表示されるメニューバー、<header>内部の<nav>がドロップダウンメニューの中身になる。 <ul>がメニューのリスト。<li>がそれぞれのメニューを示している。 #menu_buttonを押すと<ul>が開閉するように実装する。 <main>はメインコンテンツを示す。 <header> <div class="menu_button"><span>menu</span></div> <nav class="nav"> <ul> <li>メニュー１</li> <li>メニュー２</li> <li>メニュー３</li> </ul> </nav> </header> <main> <div style="width: 50%; height:1000px; background-color: #aaa; margin: 0 auto;"> メイン </div>
【実例あり】2017年の横並びレイアウトCSSはこれで決まり！【決定版】 | 株式会社ギルモット
※本記事は2016年2月14日に公開された記事を一部加筆・修正しています。 あけましておめでとうございます。 最近朝ジョナにハマってます山田でございます。 横並びレイアウトのジレンマ Web制作では毎度毎度お世話になる横並びレイアウトちゃんですが、floatにしろinline-blockにしろtable-cellにしろ、横並びを実現するための色々な方法が巷では語られているものの、それぞれ一癖も二癖もあって扱いづらいのはみなさんご存知の通りです。 ということで、この度は僭越ながら2017年の横並びレイアウトCSSをこの場を借りまして決定させていただく運びとなりました。 ずばり、 2017年は「Flexbox」です！ 異論は受け付けておりませんので、何卒ご了承の程よろしくお願い申し上げます。 Flexboxとは何や CSS3 Flexible Box – W3Schools こちらをご覧いただ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
