UIサンプルギャラリー「キプレ」
jQuery
HTML
Package
CSS
JavaScript
PHP
jQuery
HTML5
CSS3
Smarty
Twig
AngularJS
SVG
python
VueJS
BackboneJS
Blade
GoogleAppsScript
Laravel
Node.js
PWA
React
SCSS
Git
D3.js
Unix
Three.js
MENU
JavaScript
JavaScriptに関するキーワードから探す
JavaScriptに関するサンプル
- JS 選択文字の抽出と連携
-
選択した文字の情報をJSで抽出したり、SNSボタンに連携するサンプルです。
ブラウザで文字を選択した状態になると、その値をJSで検知することができます。
選択した文字を抽出したり、その文字を使って他のAPIに情報を連携するサンプ...
- 2021-01-03 17:33:46
- WebGL 立体を回転してみる
-
立体を描画し、それを3Dで回転させるサンプルです。
参考サイトMDNを参考にサンプルをそのまま実装してみました。
まだ、筆者も理解が浅いので、今日はここまでです。
下記のサイトを参考にしていま...
- 2020-11-03 22:40:47
- JavaScript 配列→JSON、JSON→配列。
-
配列をJSONにしたり、JSONを配列に戻したりするサンプルです。
配列を文字として扱い時など、JSON形式にすることがあります。
以下のような配列をJSON形式に変換します。
[[demo_arr = ["123", "123&q...
- 2020-10-31 13:00:24
- JavaScript 配列の追加と削除
-
配列の要素の追加と削除のサンプルです。
ボタンを押すと、値を配列の先頭や末尾に追加するサンプルです。
合わせて、追加した値を削除するサンプルと、すでに同じ値が存在する場合、は追加しない記述...
- 2020-10-31 12:30:46
- JavaScript クリックして直線を描く
-
画像の上を2回クリックすると直線を引くことができるサンプルです。
ユーザーに画像か何かの要素の上で、直線を引かせたいときがあるとします。(稀ですが)
開始の点と終了の点をクリックすると、要素の上に直線が現れます。...
- 2020-09-22 23:28:39
- JavaScript 重複のユニーク化とカウント
-
JavaScriptで配列の値の重複をユニークにまとめつつ、出現数を数えるサンプルです。
たくさんの文字列が配列に入っていて、重複しているとき、ユニークにまとめたいことがあります。
例えば以下のような配列があったとします。
[[
["1...
- 2020-09-22 14:28:44
- JavaScript 画像をクリックして色を抽出
-
画像をクリックするとクリックした部分の色の情報を抽出するサンプルです。
いわゆるカラーピッカーをJSで実装しています。
まず画像をcanvasに変換します。
マウスでクリックされた部分のピクセルの画像データを抽出し、色の情報...
- 2020-09-22 13:39:02
- JavaScript 画像の色からカラーチャート
-
JacaScriptでJPG画像をCanvasに変換し、色情報を解析、抽出するサンプルです。
抽出した色をカラーチャートのようにjQueryで整形してみました。
色の情報はRGBAで抽出されます。
Aは透明度なので今回は無視。
重複する色はユニー...
- 2020-09-21 18:13:36
- JavaScript 画像をcanvasに変換する
-
imgタグで呼び出した画像をcanvasに描画するサンプルです。描画の際にリサイズもします。
表示した画像をCanvasに描画します。
imgの元画像は600pxですが、CSSで200pxにしているので、canvasでも200pxに合わせてリサイズしています。
このサンプ...
- 2020-09-13 14:10:15
- JavaScript 配列の値をユニークにする
-
エクセルの関数のようなことはJSでもある程度できます。
例えば以下のような配列の値があったとします。
[[1,2,3,4,5,6,6,6,7,7,8,9,1,2,3,4,5,6,6,6,...
- 2020-08-02 00:06:06
Top