- 2015.09.01
- accordion, css, html, javascript, list,
jQuery不要のシンプルなjavascriptアコーディオンリスト
CSSのみでアコーディオンリスト2パターンではCSSのみで高さに汎用性がありませんでしたが、ちょこっとJavascriptを加えてあげることで気持ちよく動くアコーディオンリストができます。 ライブラリ […]
13/14ページ
- 2015.09.01
- flamework, javascript, Vanilla JS, フレームワーク,
jQueryもbackboneもAngularもいらない。javascriptフレームワークといえばVanilla JSに限る
世の中には便利なライブラリやフレームワークがあり、その数はどんどん増えていって、あれがいいよとかこれがいいよなんていう情報が矢継ぎ早にささやかれるわけですが、そんなにあれこれ使っていったいどうするんだ […]
Javascriptを使わないでCSSスライドギャラリー
プログラムが書けない人でも大丈夫。CSSのみで作ればいいんです。これで黒い画面が怖くてたまらないあなたのホームページにもスライドギャラリーを設置することができます！ というわけで3パターンご紹介します […]
リンクじゃない見出しにhoverしてリストを表示するテンプレート
左カラムにナビゲーションがついた、簡単なHTMLテンプレートです。 職場のHTML/CSSをあまり知らない人が作業するのでわからないところ教えてやってと言われたのですが、要件を聞いたら最新版以外のOp […]
CSSのみで地図SPAの周辺スポット検索のような画面
いろんな周辺スポットの検索結果のリストを表示して、さらに地図上にピンを立ててスポットの情報をバルーン表示する、というサービスがありますね。 食べログとかホットペッパーとか、あとは不動産なんかのサイトで […]
CSSのみでアコーディオンリスト2パターン
CSSのみで動くアコーディオンリストを2パターン紹介します。 チェックボックスを利用して、チェックが入っている項目の中身を表示する仕組みになっています。 動きの違いがわかりやすいように、transit […]
プルダウン（select）の見た目を思い通りにするCSS
プルダウン（select要素）がどうしても思い通りの見た目にならない！という悩みを抱えていたこともありました。 右の▼とかブラウザによっても見た目が違うし、色も変えられないし、なんなのよと。 結局は自 […]
画像不要！CSSのみでアイコン描画シリーズ
ずいぶん前に手さぐりで作ったCSSアイコンなので今見ると無駄も多く見た目も微妙ですがせっかくなので移管。
たったひとつのdivで麻雀牌も描画できるCSSすごい
知ってる人には今さらな手法ですが、私の中で流行っているので載せておきます。 htmlをご覧いただくとわかるかと思いますが、<div></div>のみです。 なんで作ったか： 麻 […]
CSSのみでリボン付き見出しデザイン
前回の記事のひとつめを応用して、CSSでかんたんなリボン付きの見出しをデザインしてみます。 counter-incrementなんかと組み合わせれば、ランキングの表示にも使えますね。 前回の記事はこち […]