IT業界の技術をメモ・情報公開できる
strpos系の注意する点
1)strpos($ml["mlBody"], "対象文字列") != false ・ゆるい比較(型を無視) ・0 == false とみなされる 対象文字列の位置 | 位置 | 戻り値 | 判定 | | 先頭 | 0 | false | | 途中 | 5 | true | | なし | false | false | 2)strpos($ml["mlBody"], "対象文字列") !== false ・厳密比較(型も値も見る) ・0 !== false → true 対象文字列の位置 | 位置 | 戻り値 | 判定 |
sqlのOFFSETの注意
SQL文でOFFSETを使用するときは数値を必ず使用する 文字列は使用できないSQLインジェクション対策で囲む際は注意 OKの例) OFFSET 10 NGの例) OFFSET '10'
htmlでのwebp
<picture> <source srcset="image_sp.webp" media="(max-width: 768px)" type="image/webp"> <source srcset="image_sp.jpg" media="(max-width: 768px)"> <source srcset="image_pc.webp" type="image/webp"> <img src="image_pc.jpg" alt="サンプル画像"> </picture>
PHPのarray_map関数
array array_map( コールバック関数名 , $配列1 [, $配列2, $… ] ) 引数: 第一引数にコールバック関数名を指定 第二引数からはコールバック関数に適用する配列名を1つ又は複数指定 複数の配列を指定する場合は、カンマ(,)で区切る 返り値: コールバック関数適用後の全ての要素を含む配列を返す 例) //コールバック関数 function valuestrs($str){ return $str. '曜日'; } $week = ['月', '火', '水', '木', '金', '土', '日']; //array
CSSのvw系(Viewport Units)
横幅系 vw スクロールバー含む svw UI表示時の最小幅 lvw UI非表示時の最大幅 dvw 実表示領域(推奨) 高さ系 vh アドレスバー問題あり svh アドレスバー表示時 lvh 非表示時 dvh 現在の表示高さ(推奨)
スライダーのJSプラグイン
<モダン(純粋 JavaScript/依存なし)> ・Swiper.js — 最も人気のあるモバイル対応スライダー。タッチ操作・レスポンシブ対応・多機能。 ・Splide.js — 軽量でパフォーマンス良好、依存なしのモダンスライダー。 ・Glide.js — ミニマルでスムーズなアニメーション、ES6・レスポンシブ対応。 ・Embla Carousel — 正確なスワイプ制御と豊富なカスタマイズが特徴。 ・keen-slider — 軽量タッチスライダー、ライブラリ非依存で柔軟。 ・Blaze Slider — 高パフォーマンスを重視したモダンライブラリ(コミュニティ評価あり)。
MutationObserver (DOMに変更があった瞬間だけコールバック)
MutationObserver は 常に監視し続けているわけではありません。 ・setInterval のように「定期ポーリング」しない ・DOMに変更があった瞬間だけ コールバックが呼ばれる ・ブラウザ内部の DOM変更フックで動く(イベント駆動) const init = (el) => { if (el.dataset.lottieInitialized === '1') return; el.dataset.lottieInitialized = '1'; console.log('test'); }; const observer =
ディレクト権限をroot権限なしに変更する
root権限などないが、ディレクトの権限を777以外にしたい。 あるディレクトにファイルを保存したい時など。 ACL(Access Control List)を使用。 UNIX の 3権限(owner / group / other)では表現できない“例外的な権限” を付ける仕組み ・現在の ACL を見る getfacl [ディレクト] ・apache に書き込み権限を付与 setfacl -m u:apache:rwx [ディレクト] ・新しく作られるファイルにも継承(超重要) setfacl -d -m u:apache:rwx [ディレクト]
jqueryでウィンドウ最下部の少し手前で非表示
const offset = 50; // px $(window).on('scroll', function () { if ($(window).scrollTop() + $(window).height() >= $(document).height() - offset) { $('#target').fadeOut(); } else { $('#target').fadeIn(); } });
jqueryでウィンドウ最下部判定
$(window).on('scroll', function () { const scrollTop = $(window).scrollTop(); const windowHeight = $(window).height(); const documentHeight = $(document).height(); if (scrollTop + windowHeight >= documentHeight) { $('#target').fadeOut(); } else { $('#target').fadeIn();