JS 傾き検知 スマホにはほとんど傾きを検知するセンサーが内蔵されており、その値を利用できます。 スマホのみ下記の画像が3次元にひねり動きます。 まず、特定の方向にスマホを向けて、平らにすると初期値になります。 そこから、縦に起こす数値、横にひ... 2019-08-07 21:27:06
JS idやclassの値取得 JavaScriptで特定のidやclassの要素を指定し、そのタグ内の値の取得や出力をします。 読めばわかるものの、使わなければ忘れがちな値の取得と出力です。 classの場合は「getElementsByClassName」 idの場合は「getElementById」 idは一つ... 2019-08-03 12:36:14
JS 緯度経度を取得する JavaScriptを使って現在の位置(GPS)情報を取得します。 下記のボタンを押すと、ブラウザの機能として、位置情報の取得の可否確認が起動します。 許可をすると緯度、経度、それと誤差の範囲をメートル単位で表示しま... 2019-08-07 21:19:04
jQuery クラスをSVGタグに追加、変更 SVGタグにaddClassするとクラスが追加されないときの対応です。 SVGタグにクラス操作しようとすると反映しない場合ときがあります。 そのときは以下の内容を確認してみましょう。 [[$('svg').addClass('クラス名');]]... 2019-08-07 21:15:52
JS バイブレーション 現在はまだAndroidのみですが、バイブレーションをJSで発火させることができます。 スマホには大抵バイブレーションの機能がついています。 OSがAndroidの場合、以下のJavaScriptで簡単に発動できます。 $(document).ready(function() {... 2019-07-28 17:08:52
JS CSV読み込みjQueryで表示 CSVを読み込み、jQueryで出力するサンプルです。 HTML5のFile APIを使ってローカルのCSVファイルを取り込み、加工できる状態にするスクリプトです。 下記のようなカンマ区切りのファイルをローカルに置き、... 2019-07-28 04:54:43
JS クリックでコピー ボタンをクリックするとテキストなどをコピーするJSのサンプルです。 jQueryのプラグイン「clipboard.js」を使うと、どこかをクリックすることで、クリップボードにコピーすることができます。 コピーが成功したらイベントを動か... 2019-08-03 12:30:15
CSS3 スクロールバーのスタイル スクロールバーを自分の好きなスタイルに変更するときのサンプルです。 最近、CSSでoverflow:scrollとしてスクロールバーを表示させる手法が手軽になりました。 しかし、スクロールバーのデザインはブラウザに依存していて、ページ... 2019-07-29 20:47:08
jQuery 要素のスライド 左右のボタンをクリック、タップすると要素が左へ移動します。スワイプにも対応しました。 複数のテキストや画像を並べて表示する場合、そのまま並べてしまうと画面が埋まってしまいます。 そんな時のサンプルです。 高さや幅を固定して、はみ出す... 2019-07-28 17:21:54
URLエンコード、デコードツール URLエンコードとデコードをしてくれるJavaScriptの便利ツールです。 URLの語尾(クエリー)に [[?search=http%3A%2F%2F]] のようなパーセントから始まる文字列を見かけることがあります。 これはページのプログラムに対... 2019-08-07 21:10:42