今日思いついて比較てき汎用性高かったので。 たとえばd3.jsのグラフをレスポンシブ対応させる場合に、 windowサイズが欲しいわけですがその時に <div id="aaa"> <svg>...</svg> </div> となっているとして よくあるsvgコンテナを作る部分の var margin = {top: 20, right: 20, bottom: 40, …

よくなるのでメモ ↓を付け足せばOK 親要素:after { content: ""; display: block; clear: both; height: 1px; overflow: hidden; }

色々できるのですが僕はレーダーチャートに使っています。 github.com 使い方 html部 <div class="chart"> <canvas id="myChart" width="300px" height="300px"> </canvas> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script type="text/javascript" src="vendor/Chart.js/Chart.min.js">

トップからスクロールするとひょこっとでてくる「トップに戻る」の実装法です。 html部 <p id="rippy"><a href="#"><img src="img/rippy.png"></a></p> css部 #rippy { position: fixed; bottom: -30px; right: 5px; z-index: 99; } #rippy img { width: 180px; float: right; } #rippy a { padding: 30px 0; display: bl…

ハニカム上にdivを並べられてマウスオーバーでオモテウラを切り替えられるライブラリです。 github.com 使い方(READMEより) <script src="honeycombs/js/jquery.honeycombs.js"></script> <link rel="stylesheet" type="text/css" href="honeycombs/css/honeycombs.css" /> <div class="honeycombs"> <div class="comb"> <div class="front-content"> <p>I am a front titl…</p></div></div></div></link>

ここのとおりにやったらできた。 coliss.com 基本はバックエンドを書くのが好きなんだけど時々こういうのに凝りたくなる。