フロントエンド の記事一覧
-
CSS/Sass
CSSでWEBフォントを指定できる@font-face規則の書き方
WEBフォントといえば Goofle Fonts が大人気ですが、フリーフォントをサーバーにアップロードしてWEBフォントとして使うこともできます。 Goog ...
2018/11/17 -
CSS/Sass
CSS3（selectors-3）で使用できるセレクタ・擬似クラス・擬似要素一覧
普段何気なく使ってるCSSのセレクタですが、実は結構たくさんの種類があります。 いちいち全て覚えておく必要はないですが、どういったものがあるのかを知ってい ...
2018/08/07 -
HTML
ファビコン(favicon)のタグや画像サイズは結局どれにすればいいのか
ファビコンを設定するためのタグの基本は、rel="icon"を指定した<link>タグに、「.ico」拡張子のファイルを読み込ませます。 < ...
2018/08/04 -
JavaScript
ズームインしながらフェードで切り替わるスライダーをjQueryとプラグインなしで実装してみた
よくある画像スライダーですが、先日、ズームインしながらフェードで切り変わるという少し特殊なスライダーを実装する必要があったのでその時の備忘録として。 スライダ ...
2018/06/22 -
JavaScript
【脱jQuery!】ページ内リンクのスムーススクロールをjQueryなしで実装するコード
今回は「ページ内リンクのスムーススクロール」をjQueryに頼らず実装してみました。 スクロールアニメーションはjQueryなしでは難しいとされている処理の一 ...
2018/06/22 -
JavaScript
【脱jQuery!】jQueryなしで「ページトップへ戻るボタン」を実装する
目指せ脱jQuery！ということで、jQueryなしで「ページトップへ戻るボタン」を実装するコードを2種類ほどメモしておこうと思います。 処理の流れとしては、 ...
2018/06/20 -
JavaScript
Vue.jsでLazyload（画像遅延読み込み）させるなら「lazysizes」でよさそう！
jQueryからの乗り換えでVue.jsを使用する場合、Lazyload（画像遅延読み込み）はどうすればいいのか？ 実際にコードを動かして調べてみたところ、j ...
2018/06/18 -
フロントエンド
Internet Explorerを判定してアラートを表示し、モダンブラウザへ誘導する方法（PHP版 / JS版）
一刻も早くInternet Explorer (以下 IE) の呪縛から解放されたい。 そこで、IEで訪れてきたユーザーに対してモダンブラウザへ誘導するアラー ...
2018/06/05 -
SVG
【#2】SVGを極めたい！~ ビューポートとは何か・svgタグの描画領域・width,height,viewBox属性の挙動について ~
前回、SVGで簡単に図形を描画してみたのですが、そもそもこの図形が描画されている領域はどういうものなのでしょうか。 また、<svg>タグにはその描 ...
2018/05/24 -
SVG
【#1】SVGを極めたい！~ SVGとは何か・基本図形の描画とスタイル付け ~
最近、SVGアニメーションを自由に扱えるようになりたいなと思いまして、SVGを基礎から勉強していこうと思います。 今回は第一回目、基礎の基礎編です。SVGとは ...
2018/05/23 -
CSS/Sass
擬似要素と擬似クラスの違いとは？ :before,:afterと::before,::afterのコロンの数はなぜ違う？
CSSにおける:before, :afterとか:hoverのことを擬似要素とか擬似クラスと言いますが、両者の違いは何なのかを調べてみました。 同じ意味でただ ...
2018/05/12 -
CSS/Sass
CSSでメディアクエリ(Media Queries)の基本的な書き方、記述の意味を理解し、「何となく使う」を卒業する。
今回は、レスポンシブで絶対にお世話になるCSSの メディアクエリ（Media Queries）について。基本的な書き方や記述の意味についてまとめていきます。 ...
2018/05/11
