少数点以下の桁を指定して丸める

2021-02-08JavaScript,JavaScript 数値・計算

JavaScriptのtoFixed()を利用して小数点以下の桁を指定して数値を丸める方法のサンプルコードです。 少数点以下の桁を指定して丸める toFixed()は取得する小数点以下の桁数を引数に指定します。指定可能な桁数の最小値は0、最 ...

JavaScriptを使って新規タブでページを開く方法

2021-02-08JavaScript

JavaScriptを使って新規タブでページを開くボタンの実装方法です。 See the Pen JavaScript | Open page in new window by yochans (@yochans) on CodePen. ...

SpeechSynthesisUtterance

2021-02-08JavaScript,JavaScript Audio

JavaScriptのSpeechSynthesisUtteranceを使って再生中の音声読み上げを一時停止、再開する機能の実装サンプルです。 See the Pen JavaScript | speech synthesis pause ...

楽天モバイル

2021-03-20楽天モバイル

楽天モバイルが新プランを発表しました。 新プランというよりはUN-LIMITのバージョン6(Ⅵ)というところ。前バージョンからのデメリットはないので契約している楽天モバイルのプランもそのまま新バージョンに移行します。 1GBまでは0円、これ ...

speechSynthesis.speak()で音声が出なくなる原因と対策

2021-01-31JavaScript,JavaScript Audio

JavaScriptでWeb Speech APIのSpeechSynthesisUtteranceを利用していると、JavaScriptコードは間違っていないハズなのにテキストを読み上げる音声が再生されなくなる場合があります。 この記事で ...

createElementNSでSVGの図形を描画する方法

JavaScript,JavaScript SVG

JavaScripでcreateElementNSを使ってシンプルなSVGの図形を描画する基本的な記述方法です。 図形描画のベースとなる直線、折れ線、曲線、円、楕円、四角形を紹介しています。 基本 createElementNSでSVGを扱 ...

SpeechSynthesisUtteranceでテキストを読み上げる方法

2021-02-08JavaScript,JavaScript Audio

JavaScriptで使えるWeb Speech APIのSpeechSynthesisUtteranceを利用してテキストを読み上げる方法のサンプルコードです。 See the Pen JavaScript | speech synthe ...

ページの最上部にスクロールするボタン

2021-02-08JavaScript,javascript DOM操作

JavaScriptを使ってページの最上部にスクロールするボタンの実装サンプルです。 トップへ戻るボタンはコンテンツ量が多いサイトでモバイル端末からのアクセス時にユーザビリティを上昇させます。 See the Pen JavaScript ...

最初の英文字を大文字に変換する方法

2021-02-08JavaScript,JavaScript 文字列

JavaScriptで最初の英文字を大文字に変換する方法の紹介です。 See the Pen JavaScript | Uppercase the first letter by yochans (@yochans) on CodePen. ...

ランダムなHEXカラーコードを生成する方法

2021-02-08JavaScript,javascript DOM操作

JavaScriptを使ってランダムなHEXカラーコードを生成する方法の紹介です。 See the Pen JavaScript | Randomly generate HEX color code by yochans (@yochans ...

Dateから月をフルスペルの英単語で取得する方法

2021-02-08JavaScript,JavaScript 日付け・時間

JavaScriptのDateオブジェクトから月をフルスペルの英単語で取得する方法のサンプルコードです。 See the Pen JavaScript | Get the moon in full spelled english by yo ...

文字列から英数字以外を削除する方法

2021-02-08JavaScript,JavaScript 文字列

JavaScriptでreplace()と正規表現を利用して文字列から英数字以外を削除する方法のサンプルコードです。 See the Pen JavaScript | Delete non-alphanumeric characters b ...

右クリックを禁止(コンテキストメニュー非表示)にする方法

2021-02-08JavaScript,JavaScript イベント

JavaScriptを使ってWEBサイト上または特定の要素の上で、右クリックを禁止・右クリックのコンテキストメニュー表示させないうようにする方法の紹介です。 See the Pen JavaScript | change all check ...

チェックボックスを一括指定・解除する方法

2021-02-08JavaScript,JavaScript フォーム

JavaScriptを使って複数のチェックボックスを一括指定・解除する方法の紹介です。 See the Pen JavaScript | てst by yochans (@yochans) on CodePen. 一括指定にはボタンやテキス ...

ダークモードかどうかを判別する方法

2021-02-08JavaScript,JavaScript 取得,JavaScript 判別

JavaScriptでブラウザのテーマ設定がダークモードになっているかどうかを判別する方法の紹介です。 ブラウザのテーマ設定を取得するには、ウィンドウサイズやスマホであれば縦向きか横向きかを取得する際に利用する「window.matchMe ...

ブラウザの言語設定を取得する方法

2021-02-08JavaScript,JavaScript 取得

JavaScriptでブラウザの言語設定を取得する方法のサンプルコードと主な言語コード一覧の紹介です。 ブラウザの言語設定を取得する ブラウザの言語設定は「window.navigator.language」で取得する事が可能です。 let ...

配列・多次元配列からランダムに値を取得する方法

2021-01-28JavaScript,JavaScript 配列

JavaScriptで配列または多次元配列からランダムに値を取得する方法の紹介です。 配列からランダムに値を取得 配列からランダムに値を取得する方法のサンプルコードになります。 配列にある値の数以内でランダムなキーを生成、配列キーとして指定 ...

マウスポインタの座標を取得する方法

JavaScript,JavaScript 取得

マウス座標を取得 マウス座標は各イベント情報内から取得可能です。 例えば、ページの表示エリアを基準としたマウスの座標を取得する場合は、イベント情報を格納する変数を「e」とした場合は「e.pageX」「e.pageY」となります。 座標の基準 ...

文字列からHTMLタグを除去する方法

2021-01-28JavaScript,JavaScript 文字列

JavaScriptを使ってHTMLを含む文字列から正規表現でHTMLタグを除去する方法のサンプルコードです。 正規表現を使ったHTMLタグ除去にreplace()関数を利用します。replace()関数は元の変数にある値を書き換えず、返り ...

フォーカスされているフォームのスタイルを変更する方法

2021-01-28JavaScript,JavaScript フォーム

JavaScriptでフォーカスされているフォームの文字色や背景色、サイズなどのスタイルを変更する方法のサンプルコードです。 See the Pen JavaScript Get form text in real time by yoch ...

変数の値が整数かどうかを判別する

JavaScript,JavaScript 変数

JavaScriptで対象の変数が定義されているか判別する方法のサンプルコードです。 typeof演算子を利用して変数の型を取得し、未定義となる「undefined」かどうかを判別します。 if (typeof 変数名 !== 'undef ...

長文の文章を縦書き表示にする方法

CSS テキストデザイン サンプル集,CSS

CSSで文章を右からの縦書き表示にする方法の紹介です。 文章を縦書き表示にする CSSの「writing-mode」を使って右から文章を縦書き表示にする動作サンプルとサンプルコードです。 See the Pen test by yochan ...

ゲームのプレイ速度を変更する方法

2021-01-28Phaser3 ゲーム,Phaser3

Phaser3でのゲーム速度をグローバルに変更する方法のサンプルコードです。 この方法はゲーム全体の速度を調節したい場合や、倍速モードのような仕組みを実装するのに利用できます。 ゲームのプレイ速度を変更する方法 Phaser3でゲーム速度を ...

変数の値が整数かどうかを判別する

JavaScript,JavaScript 数値・計算

Number.isInteger()は引数に指定した値が整数の場合はtrue、整数ではない場合はfalseを返します。 単純にif文で判別する場合は以下のようになります。 let val = 123; if(Number.isInteger ...

フォーム内の値をリアルタイムで取得する方法

JavaScript,JavaScript フォーム

JavaScriptを使ってリアルタイムでフォーム内に入力されているテキストを取得・表示する方法のサンプルコードです。 リアルタイムでフォーム内のテキストを取得・表示 リアルタイムでフォーム内に入力されているテキストを取得・表示する動作サン ...