Category / JavaScript
【jQuery】easing関数を作る
2013-08-03 animateやslideDownなどの動きのある処理で使う、値の変化の仕方を指定できるeasing。 jQuery本体には linear, swing のみがあり、jQueryUIやeasingプラグインを追加するとバ […]
【jQuery】回転のアニメーションをする例
2013-08-02 問題 jQueryプラグインとか無しで、回転できる？ 答え 回転します。 jQueryプラグイン無しで、回転します！ jQueryのanimateは、数値で設定できるスタイルシートのプロパティでしかアニメーションできない […]
【JavaScript】文字数を数える
2013-07-30 問題 JavaScriptで、半角は2文字で1、全角は1文字で1とカウントしてみてください。 答え デモ JavaScript <input type="text" value="&q […]
【JavaScript】URLのクエリ文字列部分を取得する例
2013-06-08 問題 JavaScriptでURLのクエリ文字列部分を取得したい。 答え 指定したキーの値を取得する例。 <script> function getQueryVariable(variable) { var […]
【JavaScript】window.btoa(‘日本語’) する
2013-05-27 問題 JavaScriptでbase64エンコード、デコードをするなら、window.btoa, window.atob がありますよね。 window.btoa('Hello!'); // → "SGVsbG8h" w […]
twitter Bootstrapでリンクを新しいタブで開けない？
2013-05-19 問題 twitter Bootstrap を使ったWebページで、新しいタブで開くのができないんだけど？ Ctrlキー+クリック 3ボタンマウスの中央ボタンクリック などが、反応がない。 答え それ直ったよ♪ https […]
Google Mapsで地図用コンテナを非表示にして地図を初期化すると表示がおかしい
2013-05-09 問題 JavaScriptでのタブ切り替えと、Google Maps の地図の表示を組み合わせた画面を作っています（Google Maps APIを使ってます）。 非表示のタブに地図の表示をしようとすると、タブを選択した […]
【JavaScript】シンプルなモーダルダイアログを表示する
2013-04-21 URL SIMPLE MODAL – http://simplemodal.plasm.it/ Screenshot メモ mootools に依存している。jQuery版があるとうれしいな。 保存 plas […]
入力もできるし選択もできるUIを作る（autocomplete、typeahead、コンボボックス）
2013-04-17 問題 ある入力欄で、一覧から選択もできるし、手入力もできるという操作ができるものを作りたいんだけど、簡単なのない？ 答え 「なるべく足さない、なるべく作らない」の方針で対応してみます。 以下、Bootstrapがあるとき […]
【JavaScript】IEかどうかを判別する（IE10からは条件分岐コメントが使えない）
2013-04-15 問題 IEかどうかを判別しようと思って以下のようにして、「その要素があればIEだ！」という判定をしていたのですが、IE10でできないみたい。どうしよう？ <!--[if IE]><div id="ie_ […]
ブックマークにJavaScriptを登録する
2013-04-14 ブックマークにはJavaScriptを登録できる ブックマークにはJavaScriptを登録できる。 URLがjavascript:alert(123);のブックマークを作ってクリックすると、alertが表示される。 使 […]
jQueryでパラパラ漫画
2013-04-08 普通の画像・写真で、アニメーションGIFっぽいことをする。 パラパラ漫画のような表示をする。 ↑ Nexus7の開封の様子 以下のコピー＆貼り付けで動くと思います（以下のソースはコピー、改変して自由にお使いください）。 […]
【JavaScript】alertでバックスラッシュの表示は
2013-04-07 問題 「\a\b\c\d\e\f\g\h\j」 とalert()で表示しようと思ったら？ 答え 「alert("\a\b\c\d\e\f\g\h\j")」 って書いちゃダメです。 「alert(&qu […]
【JavaScript】配列から空文字の要素を削除する
2013-04-05 問題 以下の配列から、空文字の要素を削除してください。 var a = ["", "123", "abc", "xyz", "", "987", "hoge", "", "fuga"] 答え 素直に1つずつ内容を見て、新 […]
tableで、しましましたい
2013-04-03 問題 よくある表の表示で偶数行がグレー、奇数行が白みたいな、縞々の表示がしたいけど、どうするのがよい？ 答え 10年前なら、サーバー側で見た目のことも考慮して、あとは表示するだけのHTMLを出力したものですが、 < […]
【JavaScript】画像を読み込んだら何かする
2013-04-01 問題 画像を読み込んだタイミングで処理をおこないたい。 答え 画像の読み込みが完了したら何らかの処理をしたいときは、こんな感じで。 //img要素を作る var $img = $('<img>'); //sr […]
【JavaScript】canvasでお絵かきしたい（半分自作する編）
2013-03-21 問題 canvasを使ったお絵かき機能を作りたいです。 出来合いのライブラリもあるみたいだけど、ライブラリのお世話になるのはなるべく最小限にしたいです。 答え canvasの操作はEaselJSを使ってみる。他の部分は自 […]
【jQuery】animate使用例（あれをしながらこれをする例）
2013-03-20 問題 ぷるぷるしながら、左から右に移動したいです。 答え こんな感じですか。 $('#target').animate( { marginLeft:600 }, { duration:3000, step:functio […]
【JavaScript】canvasでアナログ時計
2013-03-19 問題 canvasでアナログ時計って作れる？ 答え 作りましょう。 今回は、1つのcanvas要素を用いて、1秒ごとに時計全体を書き直す形で実装する。 canvasは、ほぼWindows付属のペイントの表示領域のようなも […]
【jQuery】セレクトボックスを空にしてから選択肢を追加する書き方の例
2013-03-17 問題 セレクトボックスを空にしてから選択肢（<option>）を追加してみてください。 答え id=”target”のセレクトボックス の子要素 を除去して、 id=”ta […]