- JS HTMLの上書きと挿入
- JavaScriptを使って、HTMLの要素を挿入するサンプルです。 一つの要素を書き換えるパターンと、押すたびに増えるパターンをJSのみで実装します。 ボタンを押すと下部の枠にHTMLの要素が追加されます。 innerHTML...
- 2022-04-01 08:47:41
UIサンプルギャラリー「キプレ」
jQuery
close
MENU
用途
新着
履歴
分類
★
人気のあるUIサンプル
1
jQuery 使ってしまいそうな非推奨のメソッド
2
HTML5 ダウンロードボタン
3
JS メーラー起動
4
CSS 左右に行き来するアニメーション
5
SVG 円のサンプル
6
SVG 三角形のサンプル
7
JS aタグを使わないリンクいろいろ
8
CSS tableを使わないgridの表
9
JS 波のアニメーション
10
NodeJS 画像をHTMLで表示する
11
JS 通信速度の検知
12
SVG 矢印のサンプル
13
CSS 湯気の表現
14
PWA ホーム画面に追加するボタン
15
jQuery iframeを後から読み込み
16
JS ブラウザでQRコード読み込み
17
JS カメラの映像を表示させる
18
HTML5 ローカルCSVを読み込み検索合算する
19
jQuery 指定の高さを超えたらボタンを表示
20
jQuery 長押しで発動
11〜20
更新されたサンプル
-
HTML 文字を小さくする投稿：2022-09-15
更新：2022-09-18![]()
-
HTML 斜体のいろいろ投稿：2022-08-31
更新：2022-08-31![]()
-
CSS webフォントの読み込み投稿：2022-08-30
更新：2022-08-30![]()
-
HTML 箇条書き、段落番号投稿：2022-07-31
更新：2022-08-07![]()
新着サンプル
- JS マウスの位置の取得
- マウスが要素の上に来た時の位置を取得するサンプルです。 マウスオーバーしたときと、クリックされたとき、それぞれのマウスの位置を取得します。 以下の正方形にマウスを合わせてください。 スマホではタップした...
- 2022-04-01 08:46:11
- JS CSSを追加する
- jQueryなどを使わずに、JSのみでCSSを変更する時のサンプルです。 JSでドキュメントのスタイル情報を取得して、JSで新しいCSSを追記します。 下記の四角はサイズだけCSSで記述して描画しています。 width: 200px;height: 1...
- 2022-03-30 07:41:20
- PHP 1を01、01を1に変換
- 1を01に、01を1に変換する関数のサンプルです。 日付や月など数字を使う時に、プログラムの都合上「1」ではなく「01」にしたいときがあります。 また、その逆で「01」を、ユーザー表示するときは、「1」と...
- 2022-03-21 14:24:25
- laravel 指定の文字数で文字列を切る
- 文字列を指定した文字数で切るLaravelのメソッドのサンプルです。 文章のデータを取得して表示するとき、デザイン的に文字が多すぎるときがあります。 Laravelのテンプレートのbladeではサーバサイドで簡単に操作するへルパ（...
- 2022-03-19 07:37:34
- JS 複数の要素のクリック
- ボタンが押された時にイベントを発生させるJavaScriptのみのサンプルです。 idで1箇所のみに実装するケースと、classで複数箇所に実装するケースがあります。 よく見かけるサンプルはidのケースですが、実際サービスに実装するときは...
- 2022-03-18 07:25:03
- JS クリックした位置から波紋がでるボタン
- ボタンをクリックした時に、クリックした部分から波紋が広がる演出をつけたボタンのサンプルです。 以下のボタンをクリックしてください。 クリックした部分から波紋が広がります。 以下にクリック位置が出力されます。 このようなギミックは、複数...
- 2022-03-07 08:20:53
- PHP OPcacheを活用
- Laravelなどのフレームワークでも利用可能なPHPのキャッシュの一つです。 一般的に推奨される設定としてphp.netにphp.iniの設定が記載されています。 ph...
- 2022-02-15 07:02:38
- laravel リダイレクトのサンプル
- リダイレクト処理のシンプルなコードのメモです。 https 一時的なリダイレクト [[return redirect('/', 301, [], true); ]] https 恒久的なリダイレ...
- 2022-02-10 02:59:27
- tail コマンド
- tailコマンドの最低限の使い方のメモです。 指定しない場合、最終業から１０行表示する。 [[tail -n 2 hoge.php]] -nを使うと行数を指定できる。 [[...
- 2022-02-08 00:11:14
Top