カテゴリー: 実装
レスポンシブデザインで便利なCSSを紹介。
レスポンシブWebデザイン（RWD）で使うと便利なCSSプロパティを紹介します．一般に，display: none;やwidth: 100%;は非常に使います．ここに挙げる5つの... Read More
ロード時に「loading…」を表示しフェードアウト
サイトを読み込むときに簡単なメッセージを表示し，それをフェードインする方法．jQueryは必要． <html lang="ja" data-loading=""> ... htmlタグにカ... Read More
マウスをウィンドウから外すと開閉するドロワー
マウスカーソルをブラウザウィンドウの外側に外すと，開いたり閉じたりするドロワーです． <!DOCTYPE html> <html> <head> <meta charset="...... Read More
トグルでclassを追加・除去するJavaScript
トグルでクラス名を追加削除したい時は多いですが不便でした．JavaScriptに「classList」が追加されました．classListには.add()，.remove()，.toggle()という... Read More
ドラッグドロップでスワップできるグリッド
先日の続編．要素をドラッグドロップするとき，要素がすでにある場合にはスワップできる． ※要jQuery． <script> const allowDrop = (event) => { event... Read More
ドラッグドロップできるグリッド行列
要素をドラッグドロップできるHTML5 APIを使って作った．まずそのAPI部分から． <script> const allowDrop = (ev) => { ev.preventDefault(); }...... Read More
FOUCを即効で直す方法
FOUCとは，読み込み時に画面がちらつく現象．CSSのスタイルが効いていない要素がCSSファイルより先に読み込まれてしまうことにより起こる．FOUCを... Read More
IndexedDBを試してみた
HTML5 APIのひとつ「IndexedDB」を使って動かした． <!DOCTYPE html> <html> <head> <meta charset="utf-8"...... Read More
Bootstrapでドロップダウン切替え
よく見かけるタブ切替えではなく，ドロップダウン切替えを作ってみた．特徴は，<select>タグや<option>タグを使わず，Bootstrapで作ったので... Read More
サンプルコード付きのcomponentまとめ
デザインフレームが乱立するこのウェブの世界で，使いやすさは採用するうえで重要だ．一見して分かりやすく，切り貼りできるコードがついて... Read More
bootstrap-datepickerを使ってみる
カレンダーを導入したい時のためのメモ． <!DOCTYPE html> <head> <meta charset="utf-8"> <script src="https://...... Read More
sessionStorageを試してみた
HTML5 APIのウェブストレージ（WebStorage）を試している． ローカルブラウザにセッションデータを保存できる「セッションストレージ（sessionStorage... Read More
localStorageを試してみた
HTML5 APIのウェブストレージ（WebStorage）を試している． ローカルブラウザにデータを保存できる「ローカルストレージ（localStorage）」は，随分と... Read More
FuelPHPにSQL Serverから接続する
まず，スキャフォールドする． php oil g scaffold domain 次に，SQL Serverにテーブルを作る． テーブル名は domains と複数形にする． 最後にブラウザか... Read More
Coreでerror CS0453の解決
error CS0453: 型 'string' は、ジェネリック型のパラメーター 'T'、またはメソッド 'Nullable' として使用するために、Null 非許容の値型でなければなりませ... Read More