[Category] css 全45件

CSSだけで作るドロップダウンメニューです。親メニューliにposition: relative;を効かせ相対位置に、子メニューulにposition: absolute;を効かせ絶対位置にしています。 子メニューulに…

スマホ用です。左からメニューが出てくるタイプのもの。jQueryのtoggleClassでclassを振るシンプルなものです。メニューボタンをタップしてメニューを出していますが、本当はメニュー以外をタップした場合もメニュ…

css3で自動で動く背景を作ります。 HTML CSS  animation: bgscroll 10s linear infinite;でアニメーションを設定しています。１回のアニメーションが20s(20秒)…

毎日寒いですね。鍋がおいしい季節になりましたね。1つのdiv内にbackgroundで複数の背景を設置します。IE9以上で動作します。 HTML CSS デモページ 複数設置する場合は簡単です。カンマで区切って…

デザインでよくある縦中央揃え。cssだけで割と簡単にできます。レスポンシブにも対応できます。 ポイントは外側のレイアウトにdisplay:tableを、要素を囲むレイアウトにdisplay:table-cellを入れて疑…

タブ内コンテンツの高さが合っていなくても問題ないタブメニューです。js(jQuery)でやっていることはタブコンテンツのdisplayプロパティ変更と、クリックしたタブメニューにclassを付けるくらいです。後の動きはす…

私の別の個人ブログで使用したスマーフォン用のドロップダウンメニュー。メニューを下から閉じさせたかったがために面倒くさい書き方をしています。 HTML CSS Js(jQuery) デモページ

import.jsを作り、その中にcssやjsをまとめて書く。 userAgentを使って振り分ける。 html <!–タブレットのときはPCを出す–> <script> $(function…