ブログ
「display:inline-block」での隙間（余白）を消す方法
display:inline-block;を使用すると、余計な隙間ができます。これを取り除く方法を4つ紹介します。 改行しない display:inline-block;を適用させた要素をソース内で改…
はにわまん 
PCサイトをレスポンシブ化する時の考え方と注意点
PCサイトをレスポンシブ化する際の流れと注意点を紹介します。シンプルなサイトであれば数時間で終わります。スマホ対応していないサイトは淘汰されていく時代ですので、ぜひレスポンシブ化をご検討ください！ ビ…
WordPressの編集画面にメタボックスを追加する方法
WordPressの編集画面に独自のメタボックスを追加する方法を紹介します。 メタボックスとは、タグを設定するエリアのような閉じたり移動できたりする箱です。 自分の場合は自分用のメモを常に表示させてお…
疑似要素のCSSの値（content）をJavaScriptで制御する4パターン
::afterや::beforeなどの疑似要素はDOMではないため、jQueryで制御できません。 しかし、無理やり変換する方法はあるので、その方法をまとめておきます。 プロパティを取得して変換するパ…
jQuery不要の軽量コードハイライト！「highlight.js」の解説
jQuery不要、軽量で使いやすいコードハイライト！「highlight.js」を紹介します。 この記事内でも、いたるとこでhighlight.jsが動いています。 ダウンロード ※ ver 9.12…
色の指定が自由自在！カラーピッカーを出現させるjQueryプラグイン「Bootstrap Color Picker Sliders」
Bootstrapを拡張するjQueryプラグイン「Bootstrap Color Picker Sliders」の紹介です。 読み込むライブラリが多いのが難点ですが、スタイリッシュなカラーピッカーを…
テキストをクリップボードにコピーできるjQueryプラグイン「clipboard.js」
テキストをクリップボードにコピーできるjQueryプラグイン「clipboard.js」を紹介します。 実装すると以下のような処理ができるようになります！ DEMO（デモ） ここの文字がコピーされます…
PCサイトのレスポンシブ化で横揺れさせない3つのポイント
PCサイトのレスポンシブ化で横揺れ（水平スクロール）させないポイントを3つ紹介します。 幅をガチガチに指定するPC脳は捨てて、レスポンシブ脳に切り替えましょう！ レスポンシブ化のチェックリスト 要素の…
コーダー歓喜！WordPressのエディタ編集が便利になるプラグイン「HTML Editor Syntax Highlighter」を紹介
WordPressのテキスト編集を、Sublime Textのようなテキストエディタでリッチに編集したい…。 そんな思いを実現してくれるプラグインがありました。プラグイン「HTML Edi…
登録なし！「jsFiddle」でコードの動作確認とサイト埋め込みをサクッとやろう
コードの動作確認したいときに、ローカルサーバー立ち上げて、jQueryインストールして、コード書いて、、、なんて無駄なことしませんか？ jsFiddleというWebサービスを使えば、サクッと簡単に確認…