http://ohtafelica.webcrow.jp/megaDropdown/ script accordion menuに近いスクリプトですが、動いてくれます。 まずは一つだけですが、今日はこれまで。 <script>$(function(){ $('#mddWrap').hide(); $('#mddNav>ul>li').on('mouseover',function(){ var wrap=$(th…

cssにとりかかる。 まずはシンプルなナビゲーションだと思ってはじめます。 見映えはボディー幅で、ボタンが５つ、幅800pxに収めてレイアウトします。 header{ width: 100%; height: 100px; background: #777; text-align: center; box-sizing: border-box; …

まず準備、図面を頭に入れる 絶対に入れ子構造を最初から作ろうとしない。 まずナビゲーションを作る、と考える。 ボタンはボタンだけでなく、ボタンの外側に見えない部分が隠れている。 その見えていない部分が、#mddWrap(構造部分、ブロック) #mddInner(内…

問09 cssがポイント。 全体を包む、#wrap containerのようなもの。 #wrapには、position: relative; 。ボタンをposition:absolute;で表示するため。 #wrapの中には、ボタンが２つと、#carouselが入っている。 表示領域、いちばんメインの、#carouselには、ov…