HTML コードや改行をそのまま表示 コードを表すcodeタグ、改行をそのまま表示するpreタグを使ったサンプルです。 プログラミングコードをサイト上に掲載したい時に、そのまま書くと当然コードとしてブラウザが解釈するので、プログラムが実行されてしまいます。 例えばリン... 2022-07-31 11:02:53
JS JavaScriptが無効の時のタグ noscriptタグを使ったサンプルです。 今時JavaScriptの使えないブラウザは見かけませんが、OFFにすることは簡単にできるようなUIになった気がします。 そこで改めてnoscriptタグのサンプルです。... 2022-07-30 11:43:10
HTML ローカルでオンラインの要素と一括接続 baseタグを使った使ったサンプルです。 ローカル上で作業をする時に、オンラインの要素に相対的にリンクや参照したいことがあります。 そんな時baseタグを使うと一括で指定したドメインのコンテンツ... 2022-07-25 10:52:03
laravel 配列のログ出力 デバッグの時に配列の内容をログに出力するサンプルです。 LaravelでPHPの配列をサイト上に表示せず、ログに出力する方法の備忘録です。 まずログのメソッドを呼び出し use Illuminate⁄Support⁄Facades⁄Log;... 2022-07-24 10:25:02
GTM リファラでコンテンツを変える 特定のURLからランディングしたとき、ページのコンテンツを差し替えるサンプルです。Google Tag Managerを活用しています。 ツイッターからのリンクでこのページに飛ぶと下記のボタンが青くなります。 リファラの値に「https://t.co/」が含まれると検知して、情報を差し替えます。... 2022-07-03 18:09:43
JS ページ内スムーズリンク jQueryを使わずにページ内リンク(アンカーリンク)で滑らかに移動するリンクのサンプルです。 「href="#link"」のようなページ内リンクを無効にし、クリックするとスムーズなスクロールで移動するaタグをJSで実装しました。 jQueryなしで実装しています... 2022-06-26 14:25:25
JS フルスクリーンの開始、解除 ページでブラウザのフルスクリーンモードを実装し、解除するサンプルです。 動画の再生など大画面で見てほしいコンテンツは、全画面表示をしてほしいので、このサンプルはその制御をする時に使います。 ボタンを押して、フルスクリーン... 2022-06-19 22:11:22
jQuery ローカルでリンク集 ただのリンク集のHTMLですが、JSの配列を読み込むように作られたシンプルに整形したサンプルです。 業務用PCなどでウェブサービスの利用に制限がある時、あるいは自分用のリンクメモだからネットにあげたくないような時、ローカルでリンク集を作ることがよくあり... 2022-06-12 22:35:43
JS HTMLの上書きと挿入 JavaScriptを使って、HTMLの要素を挿入するサンプルです。 一つの要素を書き換えるパターンと、押すたびに増えるパターンをJSのみで実装します。 ボタンを押すと下部の枠にHTMLの要素が追加されます。 innerHTML... 2022-04-01 08:47:41
JS マウスの位置の取得 マウスが要素の上に来た時の位置を取得するサンプルです。 マウスオーバーしたときと、クリックされたとき、それぞれのマウスの位置を取得します。 以下の正方形にマウスを合わせてください。 スマホではタップした... 2022-04-01 08:46:11