JavaScriptの.onbeforeunloadでページ離脱と指定したaタグ以外でページ遷移する場合確認メッセージの表示
使い方によってはユーザーのストレスになりますが、「ページを離脱する時」と「指定したa タグ以外をクリック」したときにブラウザがメッセージ確認をしてくれるスニペットを作りました。 サンプルも交え解説していきますので、最後ま …
illustratorでグラデーションの不透明マスクをかける方法
久方ぶりに、illustratorでやろうとしましたが、忘れてしまっていた為この記事は、メモとして残しておきたい備忘録的な内容です。 同じ悩みをお持ちの方は、参考にしてみてください。そんな記事です。 目次不透明マスクをか …
最新！レンタルサーバーの割引キャンペーン情報 [2022年5月]
ゴールデンウィーク突入の2022年5月4日現在、「カラフルボックス」「ConoHa WING」「スターサーバー」「エックスサーバー」「mixhost」「ConoHa WING」「ロリポップ！」で初期費用や、利用料金がお得 …
CSSのコピペでできるSANGOのヘッダーの子メニューをにゅいっと表示させるスニペット
当テーマでも利用しているWordPressテーマ「SANGO」のヘッダーに、管理画面で「親」「子」のメニューを設定してパソコンで見ると、hover（マウスカーソルが当たった場合）時に子メニューがヒョイっと顔を出すイケてる …
JavaScriptの.replaceとループを使って複数要素で一致する文字列を置換
JavaScriptの .replace メソッドを使って、複数要素の文字列を置換します。 是非参考にしてみてください。 目次.replace()文字列を置換するサンプル置換される前・された後のHTMLざっくりとしたコー …
JavaScriptの.outerHTMLとループで複数要素のタグと文字列を置換
タグも含まれるJavaScriptの .outerHTML とループを使って、複数要素のタグと文字列を書き換えます。 ぜひ最後までご覧いただけたら嬉しいです。 目次.outerHTMLタグと文字列を置換するサンプル’ + …
JavaScriptの.style.heightで上から落ちてくるオーバーレイのメニュー
ドロワメニューは、引き出しのようにサイト内のコンテンツを一覧にできる便利なUIです。 前回は左から出てくるUIでしたが、今回は上からオーバーレイが落ちてくるUIです。 是非、参考にしてもらえたら嬉しいです。 目次.sty …
JavaScriptの.innerHTMLでタブ内の情報を参照して表示する画像ギャラリー
画像やコンテンツの一覧を表示させて、サムネイルをクリックすると画像が切り替わるタブのようなギャラリーで表示させます。 この記事ではそんなUIについて解説していきますので、是非最後までご覧いただけたら嬉しいです。 目次.i …
JavaScriptの.insertAdjacentHTMLで指定位置にHTMLを挿入 [直感的に挿入位置が分かるサンプル付]
JavaScriptの.insertAdjacentHTML は、指定した位置にHTMLを追加するメソッドです。 この記事ではそんな.insertAdjacentHTML についての内容です。 多少解説色の強い記事ですが …
JavaScriptの.outerHTMLで指定タグをdivタグで括る
JavaScript のElement オブジェクトに .innerHTML のプロパティがあります。この.innerHTMLは、要素内の HTML を取得したり設定するプロパティです。 一方.outerHTML は、要 …
