emoseiのブックマーク - はてなブックマーク

フロントエンドエンジニアなら押さえておきたい！最近登場した注目のJavaScript＆CSSライブラリ8選
Webデザイナーやフロントエンドエンジニアにとって、日々登場するフレームワークやライブラリをキャッチアップすることはとても大切です。なぜなら、そうしたフレームワークやライブラリによって業務が効率化すれば、他の作業に時間を割くことができるからです。しかし、フレームワークやライブラリが続々と登場するあまり、キャッチアップに追いついていないひともいるのではないでしょうか。今回は、最近登場した注目のJavaScriptとCSSのライブラリを紹介していきます。中には簡単なコードを挿入するだけで驚くほどの機能を実装できるものもあるので、ぜひ確認してみてください。最近登場した注目のJavaScript＆CSSフレームワーク 1. AOS https://michalsnik.github.io/aos/ AOS(Animate on Scroll)は、スクロールしながら要素をアニメーションでふ
emosei 2017/02/10
フレームワーク

css

*あとで読む
リンク
打ち込むより簡単！保存しておくと便利なCSSスニペット18選
ホームページを製作する際、何度も繰り返し使うコードはスニペットとしてまとめておくと便利です。スニペットとは「切れ端」「断片」という意味で、プログラミング言語の中で簡単に切り貼りして再利用できる部分のことです。とりわけCSSは、HTMLやJavaScript以上に、繰り返して使うコードが多いので、そうしたコードをまとめておくとよいでしょう。今回は、何度も打ち込まなくてもコピペで使える、保存しておくと便利なCSSスニペットをまとめてみました。スニペットとしてテンプレート化することで、一部分を変えるだけで再利用することができます。保存しておくと便利なCSSスニペット 1. CSSリセットさまざまなブラウザでデフォルトの表示方法がありますが、それらを同じように表示させるCSSリセットと呼ばれるテクニックがあります。 CSSのリセット化コードはさまざまありますが、画像のレスポンシブ化とm
emosei 2017/02/08
css

簡単

スニペット
リンク
鮮やかなグラフを簡単に描画！JavaScript「Chart.js」を使った動的なグラフ・チャートの作り方
グラフを使うと、あらゆる要素が客観的に比較できるので、問題分析が容易になったり、根拠を示しやすくなります。最近では情報やデータを可視化したインフォグラフィックを見かける場面が多いですが、それもグラフのメリットを活かしたものです。しかし、グラフをホームページに掲載する時に、いちいち画像を作成するのは面倒……だと感じたことありませんか。そこで今回は、グラフやチャートをJavaScriptで動的に生成することができるChat.jsを紹介します。 Chart.jsを使えば、数行のコードを書くだけで、鮮やかなグラフを簡単に描画することができます。少しのステップで実装することができるので、実際に特徴や手順から確認してみましょう。 Chart.jsとは？ http://www.chartjs.org Chart.jsは、数行のコードで折れ線グラフや棒グラフ、円グラフやレーダーチャートなどをダイナミッ
emosei 2017/01/26
JavaScript

グラフ
リンク
1