2012-04-01から1ヶ月間の記事一覧

GoogleMapでカテゴリごとのマーカーを表示し、InfowindowのToggleを実装する

stackoverflowでGoogleマップに関するこんな質問の投稿があり javascript - Toggle Google Maps markers - Stack Overflow これに対する回答のコードが優れていたため、以下でそのコードをリーディングしたい。 Edit this Fiddle - jsFiddle locationsという…

12行のスクリプトでアコーディオンメニューを実装する

<html> <head> <meta http-equiv="Content-Type" content="text/html"; charset="utf-8"> <title>jQuery Click Outside Test</title> <style> /* display */ .more-information {display: none;} </style> </meta></head></html>

jQueryでis(':visible')を使った着色

前回の記事で使用したソースへの追記です jQueryを使って領域外のクリックイベントで消えるボックスを複数設定 - Surflog 2.0 <html> <head> <meta http-equiv="Content-Type" content="text/html"; charset="utf-8"> <title>jQuery Click Outside Test</title> <style> a { color: inherit; } .content { display: none; width: 400px; height: 80px; } .red { b…</meta></head></html>

jQueryを使って領域外のクリックイベントで消えるボックスを複数設定

ウェブアプリケーションなどで、ページ内で特定の操作をする際、 隠していた領域(style="display: none;")を表示させることはよくあると思います。 (Twitterのフィード上でつぶやく表示など) その領域の外をクリックすると、該当する領域を非表示(.hide…

Handlebar.jsを使ったヘルパーの登録

Handlebars.jsのヘルパーを独自に定義することができます。 参考:Handlebars.jsregisterHelperを使い、ヘルパーを自作するExpressionヘルパーと、Blockヘルパーの2種類がある。 Expressionヘルパーはテンプレート中の{{Expression}}を使って呼び出す。 Bloc…

Handlebar.jsを使ったテンプレートの出力、サニタイズ

Handlebars.jsをはじめる 公式のマニュアルより Handlebars.js: Minimal Templating on Steroidstype="text/x-handlebars-template"を設定したscriptタグのなかにテンプレートとなる内容を記述する <script id="entry-template" type="text/x-handlebars-template"> <div class="entry"> <h1>{{title}}</h1> <div class="bod</script>…

Vim上でタブをスペースに変換する

Vim

MacVimでタブをスペースに変換する設定 :set tabstop=4 :set shiftwidth=4 :set expandtabインデントの単位となるスペース文字数を設定 :set tabstop=4スペースをインデントと判断する文字数 :set shiftwidth=4タブをスペースに変更する設定(デフォルト設定…

はてなダイアリーでソースコードを書く

ブログにソースコードをデフォルトで書ける、はてなダイアリーは便利です。 しかも、シンタックスハイライト(言語ごとソースコードの色分け)まで自動で行なってくれます。 Syntax HiliterなどWordpressのプラグインを導入するもの面倒という人にはおすすめ…

forループでのlengthの毎回参照を避ける

lengthの参照回数を減らしforループの処理を短縮する for (var i = 0; i < data.length; i++) { // ... } for (var i = 0; n = data.length; i < n; i++) { // data.lengthへの参照をループ初回のみにする }

ブラウザから利用できるJavascriptのプロパティを一覧表示する処理

ブラウザ(windowオブジェクト)で利用できるプロパティをすべて表示する <html> <body> <script type="text/javascript"> var s = ""; for (var prop in window) { s += prop; s += "<br>"; } document.write(s); </script> </body> </html>

Javascriptでクロージャを理解する

Javascriptのクロージャを理解していない場合はかならず@DQNEO様の次のエントリーを読むこと [JavaScript] 猿でもわかるクロージャ超入門 まとめ - DQNEO起業日記 各セクションのサンプルコードまとめ[JavaScript] 猿でもわかるクロージャ超入門 2 関数の中…