JS Ajaxをプレーンで実装 プラグインを使わずにプレーンのJavaScriptで非同期通信Ajaxを実装するサンプルです。 XMLHttpRequestの関数を利用します。 XMLとありますが、JSONを使うケースが多いためJSONの例を掲載します。 [[ const xhr = new XMLHttpRequest();... 2023-01-06 00:12:08
JS タブボタンで要素切り替え プレーンJSでタブの表現を実装するサンプルです。 jQueryなどを使わずにボタンを押すと、コンテンツを入れ替える表現を実装しました。 一つ目の要素がデフォルトで表示されます。 ボタン1... 2023-01-04 00:15:20
laravel JS,CSSをまとめる laravel-mixを利用して、複数のJSやCSSをそれぞれ一つにまとめるサンプル。 laravelをインストールするとpackage.jsonにあれば、laravel-mixもインストールされる。 repository直下にあるwebpack.mix.jsを開く。 CSSを束ねたい場... 2022-11-11 06:41:01
CSS スタイルの非同期の外部参照 重要なCSSと、後から読み込んでもよいCSSを分けて実装するサンプルです。 昨今、表示の速さは検索エンジンが細かく評価するようになりました。 ページを表示する際に必要なスタイルだけ読み込み、重要でないスタイルは後で読み込むよ... 2022-11-06 10:07:47
SVG カンマのサンプル カンマ(コンマ)マークをSVGで描くサンプルです。 引用するときのマークやちょっとした用途で大きなカンマを使うときのSVGを用意しました。 3つの大きさがあるので、調整してお使いください。 大きなカン... 2022-09-18 16:43:48
HTML 文章の引用 文章を引用するときのサンプルです。 別のサイトや本など、制作物から引用するときのコードとスタイルのサンプルです。 引用マークはCSSなどで文字を追加するのではなく、SVGで記述しています。... 2022-09-18 09:52:27
HTML 文字を小さくする 文字を小さくしたいときのコーディングの記述のサンプルです。 デフォルトの文字が少し大きい時、いろいろな方法で文字を小さくできます。 普通のサイズの文字 [[<p>普通のサイズの文字</p>]] こ... 2022-09-15 16:23:08
HTML 斜体のいろいろ HTMLで斜体を表現するサンプルです。何種類かあります。 斜体といえばiタグと思いきや、他にも同じ斜体のタグがHTMLにはあります。 いわゆる斜体、イタリックで有名なiタグ このタグは区別するときに使います... 2022-08-31 22:25:07
CSS webフォントの読み込み CSSでwebフォントを使うことが増えてきたが、フォントデータを読み込む方法は複数ある。 ウェブフォントの外部参照は通信速度の速い今では、よく利用されています。 HTMLのlinkタグで読み込む場合 [[ <link rel="preconnect" href... 2022-08-30 22:45:37
HTML 箇条書き、段落番号 リスト表示でHTMLで用意されている箇条書きの表現のサンプルのまとめです。 ulのliタグはよく使うものの、大体デザインの都合上スタイルを無効にしてしまいます。 一旦それは置いといて改めてデフォルトの表示を確認するサンプルです。... 2022-07-31 11:39:19