Babel と watchify で ES2016 のビルド環境を作る
JavaScript の新仕様である、ECMAScript 2016 (以下ES2016) がリリースされました。 ES2015 はもう普通にバリバリ使ってるよという方も多いと思いますが、まだ手を出していない、って人も結…
JavaScript の新仕様である、ECMAScript 2016 (以下ES2016) がリリースされました。 ES2015 はもう普通にバリバリ使ってるよという方も多いと思いますが、まだ手を出していない、って人も結…
URLのパラメータやアンカー(#以降の部分)を取得して、その値ごとに処理を変更する方法をまとめました。 URLのパラメータで判断する場合 パラメータは、「?」+「変数(パラメータ)=値」というかたちで構成されています。 …
今回はJavaScriptの構文チェックツールについてまとめました。 これからチェックを始める方が、基本的なチェックを始めるまでの方法を紹介したいと思います。 主な構文チェックツール(JSLint,JSHint,ESLi…
CSSの擬似要素::beforeや::afterを使って、文字列や画像等を挿入することありますよね。挿入したい内容は、下記のように、contentプロパティの値に指定しておけば、要素の直前か直後にCSSだけで擬似的に挿入…
グノシーやスマートニュース、日経電子版などのニュース系アプリでよく使われているUIで、スワイプで記事一覧が横スライドしていくものがあります。 大量の更新記事をカテゴリ毎に効率よく見せるのに非常に効果的なUIです。 web…
みなさんSVGしてますか? 前回SVGアニメーションについて書きましたが、今回はその延長でSnap.svgを使ったマウスオーバーアニメーションを作成してみたいと思います。 まずはこちらをご覧ください。 完成デモ >> タ…
最近、Windows環境の方に gulp をセットアップするお手伝いを連続でやっておりましたので、手順をまとめておきます。 Mac だとすんなりいくインストールも、Windows だと妙なハマり方をすることがあるので、ご…
レスポンシブWebデザインではおもにウィンドウサイズによってレイアウトを変更していきますが、画像はHTMLとCSSだけでは最適化するのが難しいです。 backgroundプロパティであればメディアクエリで切り替えられます…