JavaScript

入力フィールドとかの全角を半角にする

投稿 | | カテゴリー JavaScript
全角の数字やアルファベット、一部の記号を半角に変換する方法です。ネタはどこにでも転がっていて、自分でもどなたのソースが元ネタかわかりませんが、忘れた時のために覚え書きします。 UTF16の文字コードでいうところ、全角の数字やアルファベットは半角の65248個分後ろに…

郵便番号を入力して住所を自動入力してくれるライブラリ「ajaxzip3」と「YubinBango」

投稿 | | カテゴリー JavaScript
たまに申込フォームやお問い合わせフォームなんかで、郵便番号を入力すると住所が自動で入力されるやつ。自分も4〜5年前から ajaxzip3 というライブラリを使っていたんですが、Google Code の閉鎖に伴って死んだままになってるサイトがありました。 …

ページをフワッとフェードインさせる

投稿 | | カテゴリー jQuery, JavaScript
タイトル通り、ウェブページを読み込んだ時にフワッとフェードインで表示させるやり方です。フェードインは、CSSだけで再現するのであればanimationでできますが、今回のはjQueryの話になります。たまたま jQuery でフェードインするのに「CSS で body を非表示にしておきます」み…

parseInt() で文字列を数値に変換する時は基数を指定する

投稿 | | カテゴリー JavaScript
前に、JavaScriptでページ内の数値を扱うためにparseInt()で文字列→数値変換したらシクってしまったのでメモしときます。 このときの変換元の文字列というのは「商品の個数」の入力フィールドの値だったので、とりあえず0や数字以外は受け付けないよ…

postMessage()を使ってインラインフレーム <iframe> の高さをコンテンツ内容に合わせる

投稿 | | カテゴリー JavaScript
いろいろ制約があってインラインフレームしか使えないけどスクロールは出したくない、とか<iframe>の高さをコンテンツに合わせたい時に、親ウィンドウ側とフレーム側の異なるドメイン間でpostMessage()でクロスドメイン通信を行ってフレーム側の高さを取得するメモです。 …

jQueryでCSSのtransform: rotate()を使った回転アニメーションする際のメモ

投稿 | | カテゴリー jQuery, CSS, JavaScript
回転のアニメーションを実現するだけのシンプルなjQueryプラグインもあるようですが、それだけのためにプラグイン読み込むのもイマイチなので、もっと簡単にCSSのtransitionを使って回転させます。 2016.9.17 追記 動かないコードが載っていたので削除して加筆修正…

テキストエリア、テキストフィールドのキャレット位置に文字列挿入

投稿 | | カテゴリー JavaScript
テキストエリアやテキストフィールドに入力された文字のキャレット位置に新しく文字列を挿入する備忘録です。コードは、確立されているというか参考にさせていただいた元ネタがあったんですがどちら様のサイトか忘れてしまいました。 実際は古いIEのdocument.s…

非同期(jQuery AJAX)でページ移動した時の履歴とかのメモ

投稿 | | カテゴリー jQuery, JavaScript
「検索結果の次のページ」とか、AJAX使ってリンク先URLの内容を読み込んで表示する時に、「ブラウザの履歴とかアドレスバーをリンク先のものに書き換える」ためのメモです。 window.history.pushState()を使います。 「検索結果の次のペー…

IEの outerWidth, outerHeight の値を取る、でうまくリサイズ

投稿 | | カテゴリー JavaScript
JavaScriptで「ウィンドウを無理矢理リサイズ」なんてこと最近メッキリやらないので、IEでメニュー部分やスクロールバーを含んだウィンドウのサイズ、innerWidthとinnerHeightの値が取れないことなんて気にもしませんでした。 ちょっとヤボ用で必要になったので色々調べてみたら「…