人気のあるUIサンプル

• JS HTMLの上書きと挿入
• JavaScriptを使って、HTMLの要素を挿入するサンプルです。 一つの要素を書き換えるパターンと、押すたびに増えるパターンをJSのみで実装します。 ボタンを押すと下部の枠にHTMLの要素が追加されます。 innerHTML...
• 2022-04-01 08:47:41

• jQuery ローカルでリンク集
• ただのリンク集のHTMLですが、JSの配列を読み込むように作られたシンプルに整形したサンプルです。 業務用PCなどでウェブサービスの利用に制限がある時、あるいは自分用のリンクメモだからネットにあげたくないような時、ローカルでリンク集を作ることがよくあり...
• 2022-06-12 22:35:43

• JS フルスクリーンの開始、解除
• ページでブラウザのフルスクリーンモードを実装し、解除するサンプルです。 動画の再生など大画面で見てほしいコンテンツは、全画面表示をしてほしいので、このサンプルはその制御をする時に使います。 ボタンを押して、フルスクリーン...
• 2022-06-19 22:11:22

• JS ページ内スムーズリンク
• jQueryを使わずにページ内リンク（アンカーリンク）で滑らかに移動するリンクのサンプルです。 「href="#link"」のようなページ内リンクを無効にし、クリックするとスムーズなスクロールで移動するaタグをJSで実装しました。 jQueryなしで実装しています...
• 2022-06-26 14:25:25

• GTM リファラでコンテンツを変える
• 特定のURLからランディングしたとき、ページのコンテンツを差し替えるサンプルです。Google Tag Managerを活用しています。 ツイッターからのリンクでこのページに飛ぶと下記のボタンが青くなります。 リファラの値に「https://t.co/」が含まれると検知して、情報を差し替えます。...
• 2022-07-03 18:09:43

• laravel 配列のログ出力
• デバッグの時に配列の内容をログに出力するサンプルです。 LaravelでPHPの配列をサイト上に表示せず、ログに出力する方法の備忘録です。 まずログのメソッドを呼び出し use Illuminate⁄Support⁄Facades⁄Log;...
• 2022-07-24 10:25:02

• HTML ローカルでオンラインの要素と一括接続
• baseタグを使った使ったサンプルです。 ローカル上で作業をする時に、オンラインの要素に相対的にリンクや参照したいことがあります。 そんな時baseタグを使うと一括で指定したドメインのコンテンツ...
• 2022-07-25 10:52:03

• JS JavaScriptが無効の時のタグ
• noscriptタグを使ったサンプルです。 今時JavaScriptの使えないブラウザは見かけませんが、OFFにすることは簡単にできるようなUIになった気がします。 そこで改めてnoscriptタグのサンプルです。...
• 2022-07-30 11:43:10

• HTML コードや改行をそのまま表示
• コードを表すcodeタグ、改行をそのまま表示するpreタグを使ったサンプルです。 プログラミングコードをサイト上に掲載したい時に、そのまま書くと当然コードとしてブラウザが解釈するので、プログラムが実行されてしまいます。 例えばリン...
• 2022-07-31 11:02:53

• HTML 箇条書き、段落番号
• リスト表示でHTMLで用意されている箇条書きの表現のサンプルのまとめです。 ulのliタグはよく使うものの、大体デザインの都合上スタイルを無効にしてしまいます。 一旦それは置いといて改めてデフォルトの表示を確認するサンプルです。...
• 2022-07-31 11:39:19