deconcepter.jpThis domain may be for sale!
Sign in - Google Accounts
Not your computer? Use a private browsing window to sign in. Learn more about using Guest mode
JavaScript：undefined値の判定
JavaScriptでは初期化されていない変数には全て「undefined」という値が入っています。 var a; alert(a); //undefinedが入っている これを利用して、変数が定義済みかどうかを判別することが可能です。…が、やり方がいろいろあるみたいなので、まとめてみることにします。 undefinedと比較する if (a === undefined) { alert("aは未定義"); } グローバル変数として、そのまんまundefinedという名前の変数が用意されているので、それと比較するやり方。一番素直な方法ですが、JavaScriptにおいては良くない書き方とされています。 undefinedは予約語ではなく、単なる変数です。だから上書きすることができるし、関数スコープ内で同名のローカル変数を作ることもできます。（ただし最近の処理系ではconst扱いになって上書
Yahoo!地図APIでマーカーをクリックすると吹きだしを出す方法
Google Maps APIを使っている人にとっては、今回のタイトルは「はい？」と感じるほどに当たり前のことだと思います。 私もそう感じた1人です。(笑) 公式解説ページである「Yahoo!デベロッパーネットワークJavaScriptマップ」を見ましても、アイコン(マーカー)、吹きだし(バルーン)のキーワードが出てきますので、当然できるものとばかり思っていました。 ところが、ここからドツボにハマる私がいます…。 Yahoo!地図WEB API(YOLP)の基本的な使い方にバルーンが無い先ほどの公式解説ページにあります「基本的な使い方」を見てみますと、「地図上にアイコンや図形を表示する」という、それらしい項目がまず目に付きます。 書かれている項目としては、「文字を表示」、「アイコンを表示」、「線を表示」、「多角形を表示」、「円を表示」となっていて、そもそも吹きだしが書かれていない…。(汗)
Yahoo!地図WEB APIへ超簡単に地図検索を実装
前回は「Yahoo!地図WEB APIでマップ表示」として、Yahoo! Open Local Platform(YOLP)のJavaScriptマップの基本について書きました。 今回はYOLPのJavaScriptマップ上に、地図検索機能を凄く簡単に実装する方法を書きたいと思います。 これを知ることで、YOLPに凄く惹かれていくことになるでしょう。 他にも魅力的な機能がテンコ盛りなのですが、まずは第1歩として地図検索に触れてください。 Yahoo!地図WEB API(YOLP)に地図検索機能を付けるでは早速Yahoo!地図に地図検索機能を付けてみましょう。 「Yahoo!地図WEB APIでマップ表示」の最終型のソースコードに追記する形にします。 見やすさを優先するため、若干表示サイズやズームスライダーを変えていますが、基本は同じです。 <html> <body> <div id="ma
Googleとの比較で学ぶYahoo!マップAPIの使い方 (1/3)
Yahoo! JAPANが提供している地図サービス「Yahoo! Open Local Platform（YOLP）」の「JavaScriptマップAPI」（以降は「Yahoo!マップ」と表記します）について、前回に続きGoogle Maps APIと比較しながら解説します。基本的な地図の表示、マーカーやクリックイベントの設定方法は前回紹介しましたので、今回は、地図の移動やズームレベルの変更方法、地図上への多角形の描画方法を解説します。 地図を移動させる 最初に、指定した緯度・経度の場所に地図を移動させてみましょう。地図の移動は、GoogleマップもYahoo!マップもマップオブジェクトのpanTo()メソッドを使い、移動先の緯度・経度を示すオブジェクトを引数に指定します。 Yahoo!マップの場合は、panTo()メソッドの第2引数にアニメーションフラグを指定できます。trueならアニメ
serializeとjson関数の比較 - Y's note
概要 serializeとjson_encodeのどちらの利用が望ましいかを調べます。理由はWebAPIを作成するときにどのレスポンス形式が最適なのかを検証する必要がでてきたためです。事前に上がった意見としては”json_encodeの方がデータ容量少なくなるから速いっしょ”、”serializeの方がphpをそのまま扱っているんだから変換処理コストが少ないはず”などの意見がありましたが、どれが正確か分からないので実際に試してみます。 サンプルするデータ 50回実行して処理時間の平均値をサンプリングします。 php配列から各エンコード処理を施した時の処理コスト シングルバイト文字列を含む配列を変換するコスト マルチバイト文字列を含む配列を変換するコスト エンコードしたデータからphp配列への復元処理コスト シングルバイト文字列を含む配列エンコードしたデータをデコード マルチバイト文字列を含
jQueryでタイマー処理（X秒後にフェードイン等） - [k]id[k]id
jQueryを使用して何秒後に処理を実行したい等 タイマー的な処理をしたい場合は delay();を使用します。 具体的な使用例は以下。。 <script type="text/javascript"> $(document).ready(function(){ jQuery("#Footer").delay(7000).fadeIn(500); }); </script> 上記サンプルではフッターが7秒待機後にフェードインします。
![jQueryでタイマー処理（X秒後にフェードイン等） - [k]id[k]id](https://cdn-ak-scissors.b.st-hatena.com/image/square/08332d48846c4ef5c9673fbe82f5983033955eed/height=288;version=1;width=512/https%3A%2F%2Fkidokorock.com%2Fwp-content%2Fthemes%2Fkid_2015%2Fimages%2Fcommon%2Fthumbnail%2F225.jpg)
Microsoftの翻訳APIを試してみた – Shimabox Blog
1年程前にHTML5の音声入力とGoogle翻訳APIを使ってこんなのを作ってみたけど、 HTML5の音声入力とGoogleの翻訳APIを試してみた | Shimabox Blog Google翻訳APIがフリーで使えなくなっていて全然動かなくなってた。。 ※参考記事 Google Translate API v2 有料化と v1廃止に伴って、Microsoft Translatorを使って見る余地はあるかもという話 – くるえるはてなくしょん いやぁ〜、何というファ○ク。でもまぁ、そのままにしとくのも悔しいので、 こちらの記事にある通りMicrosoftの翻訳APIを試してみる事にしました。 Microsoftの翻訳APIは上記の参考記事中にもありあますが、 使ってみよう！ Windows Live SDK/API：第38回 使ってみようMicrosoft Translator｜gihy
svgフォント編集スクリプト
ヒント お手持ちのsvg画像からフォントとかパスを抽出してsvgフォント化することができます． フォント情報が見つからなかった場合，パスを抽出します．一つのパスを文字として解釈します． ファイル読み込み時にパスのリサイズや位置の調整を行うことができます．いろいろ試してみましょう． 文字をクリックすると内容を編集することができます．位置の微調整等を行う際にご利用下さい． 余りに複雑なsvgファイルを読み込んだ場合，スクリプトが応答しなくなる場合があります．（このような図形はそもそもフォントとして不適でしょう．） 本スクリプトで生成したsvgフォントファイルは全ての環境で正しく動作するとは限りません．webkit系/operaのブラウザで試すか，下のサービスを使って他の形式に変換して使いましょう． ここで生成したsvgフォントファイルはicomoonでeot,ttf,woff形式に変換できます
JS 大規模プロジェクトの管理手法 – ロードオブナイツの実例紹介
どうもこんにちは。 Aiming で東京開発グループのゼネラルマネージャをやっている小林です。 8月に mobage と Yahoo! モバゲー で ロードオブナイツ というシミュレーション RPG をリリースさせて頂きました。 そして、先週、 Yahoo! モバゲー版の PC ブラウザ専用デザインをリリースさせて頂きました。 今回リリースしたものは元々 Unity で作られていた iOS アプリ版 Lord of Knights を HTML5 で書きなおしたものです。 （今は Android 版 もあります） HTML のポチポチゲーをネイティブに移植したというのはよく聞く話ですね。 ですが、逆にリッチなネイティブアプリを HTML5 に移植し、かつスマフォブラウザと PC ブラウザで同じものを動かすなんてのは前例が見当たりませんでした。 技術的ハードルが高かったことに加えて期日がタイ
javascriptの関数が変態すぎる
思いは言葉に。 はてなブログは、あなたの思いや考えを残したり、 さまざまな人が綴った多様な価値観に触れたりできる場所です。
iPhoneのGPSをJavaScriptで操ろう (1/6)
JavaScriptの利用範囲がどんどん広がっています。ライブラリの充実によって、比較的手軽にいろいろなことができるようになり、Webサイト／Webアプリケーションだけでなく、今やモバイルデバイスやデスクトップアプリケーションなどの分野でもJavaScriptが活躍するようになりました。 本連載では、多数のJavaScript関連書やASCII.jpの連載「29分でできる！あのサイトの技を盗め」の執筆でもおなじみの古籏一浩氏が、最新のAjax/JavaScriptライブラリの解説から、今後注目される新しいJavaScriptの活用Tipsまで、“楽しくできて役立つネタ”をお届けします。 初回は「iPhone 3GS」に合わせてリリースされたiPhone OSの新バージョン「iPhone OS 3.0」がテーマです。iPhoneならではのGPS機能をSafariのJavaScriptで活用す
Google Map現在地アイコン／レーダのようにパルス発信するアニメーション | WordPressにGoogle Maps API V3！
iPhone（スマートフォン用端末）のGoogle Map アプリのような現在地アイコンがいいな~なんて探していたら有りました。 plebeosaur.us “Here We Are Again” 青いドットのアイコンで周囲にレーダーのように青いリングが広がっていくアニメーション付きです。 ライセンスは「MIT-LICENSE」で、ソースはコチラ。 このgoogle mapライクなアイコンですが、中央の青いドットは、通常のアイコンとなんら変わりはありません。ただし、周囲のリングは、Webkitによるものとかで、Chromeやsafariなど対応しているブラウザでしか表示されません。 つまりiPhone用の地図（safariで見る）なら使えます。 中央の青いドットは、Script側のnew google.maps.Marker(・・・・)でiconを指定。周囲の青いリングは、スタイルシートで
マンガで分かる JavaScriptプログラミング講座
はじめに 「マンガでわかるJavaScript」は、難しそうに思えるプログラムを、簡単そうに見えるマンガで解説するという初心者向けの入門講座です。 架空の高校生たちに教える形式で、プログラムの基礎から応用を、解説していきます。一通りのマンガを読めば、かなり実践的なところまで、プログラムを書けるようにしていきます。 （マンガは、左上から右下へと読みます） プログラムというと、けっこう大変そうに思えますが、この講座のテーマは「面倒くさいことを楽にする」です。面倒臭がりで、手抜き大好きの女子高生を主人公にして、楽しくプログラムを学んでいくことにします。 主な対象読者は「これからプログラムを学んでみたい人」「Webの世界に関わっていてJavaScriptを学んでみたい人」「昔JavaScriptを触っていたけど最新のトレンドが分からないので改めて学んでみたい人」などです。初心者だけでなく、Webデ
30分でできる！Webサイトを高速化する6大原則 (1/4)
Webサイトを制作するとき、「パフォーマンス」を気にしたことがあるだろうか？ もしまったく気にしたことがないなら、気をつけた方がいい。閲覧に時間のかかる“遅いWebサイト”はユーザーにフラストレーションを与え、閲覧をやめさせてしまう恐れがある。 下記のグラフは、「Simple-Talk」という海外のオンラインメディアで発表されたユーザー調査の結果だ。アンケートページの表示にかかる時間を意図的にコントロールし、表示時間によってユーザーが感じるフラストレーションの違いを調べたものだ。 縦軸がフラストレーション（10段階）、横軸が表示までの時間を表している。1～5秒以内にページが表示された人に比べ、ページ表示までに5秒以上かかった人は2倍以上もフラストレーションを感じている。フラストレーションがあまりに高ければ、せっかく何らかの目的を持って訪れてきたユーザーも待ち切れずにブラウザーを閉じてしまう
3分でできるJS＋CSS「角丸」テクニック (1/3)
“Web2.0”っぽいWebデザインの定番、角丸ボックス。実際、ここ数年、サイドメニューやナビゲーションバーなどに角を丸くしたブロック要素を多用するサイトを目にする機会が増えています。 ところがこの角丸ボックス、（X）HTMLとCSSだけで実現するには、コーナー部分の背景画像を用意したりCSSを書き足したりと、意外に手間がかかって面倒です。現在、W3C（World Wide Web Consortium ）で策定が進められているCSS3（CSS level 3）では、ブロック要素の角を丸くできる border-radiusプロパティが追加される予定ですが、現在のところCSS3は一部のWebブラウザーしか対応していませんし、border-radiusプロパティの実装状況にもばらつきがあります（Firefoxの -moz-border-radius、Safariの -webkit-border
ASCII.jp：Web制作会社が作った！超使えるJavaScriptライブラリ
「Webサイトを作るときに本当によく使う機能を、自分で作らずにさくっと実装したい」――。そんなワガママな願望をかなえてくれる JavaScriptライブラリが登場した。ミツエーリンクスが今月オープンソースとして公開した「MJL（MITSUE-LINKS JavaScript Library）」は、Webサイト制作に必須の“最小限の機能”に絞ったJavaScriptライブラリだ。 昨今相次いで公開されている、リッチなUIを実現するJavaScript/Ajaxライブラリとは異なり、MJLの機能はとてもシンプルだ。もともとWeb制作会社であるミツエーリンクスが「自社標準ライブラリ」として作成したものだけあって、汎用性・実用性を重視したライブラリになっている。 具体的な機能は以下の6つ。確かにどれもよく使いそうなものばかりだ。 画像のロールオーバー Flashオブジェクト埋め込みの機能拡張 新規
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://mapon.me/lec/
Web ページを高速化する
