JavaScriptの.classListを使ったclassの削除や追加
.classList で、要素のclassを削除したり、追加したりすることが可能です。 目次.classList.classList.toggle()を使ったサンプル.classList.toggle()を使ったコード …
JavaScriptの.remove()で要素の削除
.remove() を使うことで要素の削除が可能です。ここでは、JavaScriptの.remove() を使ったサンプルと合わせて解説します。 目次.remove()を使ったサンプル.remove()を使ったコード.q …
スライダーの超定番ライブラリSwiper.jsの基本と使い方
スライダー・カルーセルは、複数の選択肢やコンテンツを列で表示させるUIで、限られたスペースにたくさん表示させたい時によく使われます。 この記事は、スライダー・カルーセルUIの超定番とも言えるSwiper.jsについて解説 …
jQueryのコピペでヘッダーにアニメーションをつけて固定表示させるスニペット
ヘッダーは、主にページの上部に位置するコンポーネントで、サイトやブログなら各メニューを表示したり、どのページが開かれても常に共通して表示されます。 この記事は、そんなヘッダーを少しカスタマイズするスニペットで、特にブログ …
プラグインなしで記事毎のbody閉じタグ前にJavaScriptのコードを出力させるフィールドを作るスニペット
JavaScript（以降JSと省略します）を記述する場所は、<body>〜〜</body>タグの最後(クロージングタグ前)に書くことが推奨されています。 この記事で紹介するスニペットは、コピペするだけで記事 …
WP REST APIをReactでWordPressの記事一覧を表示させるスニペット [React版]
以前の記事では、jQueryとWP REST APIを使って記事一覧を表示するスニペットを紹介しましたが、今回はAPIでReactを使った記事一覧の方法について解説していきます。 関連記事 WP REST APIのJav …
HTMLとCSSのコピペでできる背景デザイン11選
PhotoshopやIllustratorは今でもデザイナーにとっては必需品に近いものですが、Webに限って言えば背景やパターンやグラデーション、シェイプなど、それらは簡単にCSSでできてしまいます。 そんなCSSを再度 …
ツールチップの基本的な役割と使い方
ツールチップは、要素の上にhoverすると表示される吹き出しで、よくWebサービスの小難しい入力画面の「ヒント」などで見かけるUIです。 そんなツールチップについて、この記事では使い方やメリット・デメリットについて解説し …
jQueryライブラリclipboard.jsでできるタイトルとURLのコピーボタン
国産で主流のWordPressテーマなら、SNSシェアボタンなど記事のURLのコピーが簡単にできますが、そんな機能がない場合、そこまで時間がかかる作業ではないですが、記事を共有する為にコピペが必要です。 この記事は、記事 …
レンタルサーバーをディスク容量・転送量で比較！ディスク容量と転送量を解説
レンタルサーバーのスペックを比較する時に、どの点を見ればいいのかイマイチ分からないという方も多いのではないでしょうか？ 安定してサーバーが稼働するかについてや、表示スピードが速いかどうかを判断する一つに、ディスク容量と転 …
