当記事では、HTMLとCSSのみでファイルのドラッグ&ドロップ機能を作る方法を記します。 ⓪やりたい事 下記のようにドラッグ＆ドロップでファイル選択できる機能をHTMLとCSSのみで実装する事を目指します。 ①i […]
HTMLとCSSのみでファイルのドラッグ&ドロップ機能を作る
【CSS】input type=”file”の見た目を変更する方法
::file-selector-button疑似要素の登場によりinput type=”file”のデザインの変更にJavascriptが必要なくなりました。当記事では、CSSのみでinput t […]
【CSS】自動で流れ続ける無限ループスライダーを作成する
当記事では、CSSのみで自動で流れ続ける無限ループスライダーを作成する方法を記します。 ①スライド要素を用意 HTMLでスライド要素を用意します。下記のようにスライドを2セット用意するようにしてください。(ここでは4枚× […]
【PHP】var_dumpに色や改行を付けて見やすくする
使用頻度が高いのに見ずらいPHPのvar_dumpの結果に色や改行を付けて見やすくしよう！という趣旨の記事になります。 やりたいこと PHPでプログラムを書いてるとvar_dumpで変数の中身を確認する作業は何千何万回行 […]
【PHP】ファイルの行数をカウントする方法
当記事では、PHPでファイルの行数をカウントする方法を記します。読み込んでいるすべてのファイルの行数をカウントする方法についても記します。 単体のファイルの行数をカウントする file関数にファイルパスを渡すことで、各行 […]
【PHP】見出しから目次を自動生成する方法
当記事ではPHPを使用して見出しから目次を自動生成する方法について記します。複数階層の見出しにも対応しています。 やりたいこと 下記のようなHTMLがある時に、PHPを使用して、見出しから目次を自動生成する事を目指します […]
【Javascript】見出しから目次を自動生成する方法
当記事ではJavascriptを使用して見出しから目次を自動生成する方法について記します。複数階層の見出しにも対応しています。 やりたいこと 下記のようなHTMLがある時に、Javascriptを使用して、見出しから目次 […]
【Javascript】一度実行されたら破棄されるイベントの書き方
現代の主要ブラウザにおいて、Javascriptで一度だけ一度だけイベントを実行するのにremoveEventListenerもフラグも必要ありません。とても素晴らしいオプションが用意されているので、刮目しましょう。 す […]
【Javascript】HTML文字列からNodeに変換する方法
当記事ではHTML文字列からNodeに変換する方法について記します。 HTML文字列からNodeに変換 これはとても簡単で1行で関数を定義できます。ここから先は補足情報になります。 変換したNodeに対してはDOM操作が […]
【Javascript】イベントの発生元がユーザーの操作か判定する方法
当記事ではイベントの発生元が実際のユーザーの操作なのか、スクリプトによる強制発火によるものなのかを判定する方法について記します。 Javascriptでイベントの発生元がユーザーの操作か判定 イベントリスナーのコールバッ […]
