Google Waveを使っていると、普段使っているメールアドレス以外にGoogle Waveに「もう1つ別の受信箱があること」が悩ましかったりします。ですが、このお悩みもThunderbirdのタブにGoogle Waveの受信箱を表示させることができるようになったので、一気に解決です。 ThunderbirdのタブにGoogle Waveの受信箱を表示させるには、JavaScriptをほんの1行追加するだけでOKです。タブ機能はThunderbird 3からの新機能ですが、他のWEBサイトのページや、WEBベースのメールサービスを読み込むことができて、とても便利です。 詳しいやり方は、ブログ「Quetzalcoatal 」に載っていました。一度設定すると、Thunderbirdを再起動しても、常にGoogle Waveの受信箱をタブに表示できますよ。 Thunderbirdを立ち上げた
（注意！）この記事は、旧APIであるGoogle Maps API version 2を解説したものです。version 2の利用は推奨されていないので、意図的に旧バージョンの情報を探していない場合は、新しいバージョンの解説をご覧下さい。 ここでは、Google Maps APIを立体地図表示にする方法を説明したいと思います。 setMapTypeを使ったサンプル 以下のサンプルはGoogle MAPS APIを使ったページのソースです。 強調してある部分が地図を立体地図表示に設定している部分です。 G_PHYSICAL_MAPという部分をG_NORMAL_MAPとすると通常の地図になります。 G_SATELLITE_MAPとすると衛星写真表示になり、G_HYBRID_MAPとすると地図＋衛星写真のハイブリッド表示になります。 その他、月面表示や火星表示などもあります。 <!DOCTYPE
（注意！）この記事は、旧APIであるGoogle Maps API version 2を解説したものです。version 2の利用は推奨されていないので、意図的に旧バージョンの情報を探していない場合は、新しいバージョンの解説をご覧下さい。 GScreenOverlayを利用すると、画面上に固定された画像表示ができます。 マーカーの場合は、地図と共に移動してしまいますが、GScreenOverlayは地図ではなく画面(スクリーン)に対して固定されます。 GScreenOverlayは、コンパスやロゴマークの表示に使うのが良いと公式リファレンスには書いてあります。 サンプル 以下のサンプルはGoogle MAPS APIを使ったページのソースです。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.o
WebページでHTMLやJavaScriptを表示させる場合に厄介な問題がある。実際のソースコード、たとえばそれはHTMLやJavaScriptだったりするわけだが、実際に使われるそういったコード保守する必要があるほか、そのコードを表示させているHTMLの方に含まれているコードも保守する必要があるということだ。 大量のチュートリアルを作成している場合などは特に面倒なことになる。デモコードを書き換えるごとに、それを表示させているHTMLの方に含まれているコードも変更しなければならない。編集を忘れてしまえば実際に動作しているコードと表示されるコードが違うという事態にもなる。 同じことを考えるプログラマは多いようだ。Christian Heilmann氏は1月29日(米国時間)、Displaying source code with Ajaxのタイトルのもと、外部のファイルをインクルードして表示
今回はJavaScriptとWebページの表示・操作の体感速度について考えてみます。というのは，JavaScriptのせいでWebページの表示や操作などの速度が遅くなっている，と感じることがあるからです。 現在のWebサイトでは，JavaScriptを使って使い勝手を向上することは，ごく当たり前に行われています。例えば，動的にページを書き換えたり，ページ遷移を行わずにサーバーと通信を行ってデータを取得したりと，JavaScriptを使うことで，Webサイトをより便利に，より使いやすくすることができます。 Ajaxという言葉がはやってから，もう2年以上がたつんですよね。何年か前，JavaScriptはじゃまで，セキュリティを低下させる不要なものだと見なされていた頃がありました。しかしそれから一変して，「JavaScriptをがんがん使ってもいい」という空気になったことで，Webサイトを作成す
以下の一行をすべての JavaScript の前に読み込む /*@cc_on _d=document;eval('var document=_d')@*/ この一行を読み込むことによって IE での document へのアクセスが 5 倍速くなります。 たとえば 以下のように、読み込む前と読み込んだ後を比較してみます。 // Before var date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date - date); // 643 /*@cc_on _d=document;eval('var document=_d')@*/ // After date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date -
未だに半年前のエントリにブクマされるみたいなので、もう少しjavascriptについて書いてみる。 今回は大規模化開発におけるJavascriptの注意点とかそういうの。当てはまらない環境の方もいます。(しかも基本的な事だらけで大したことは書いてないです) ほぼリッチクライアントを主目的としたjavascripterとコードを対象とします。 どちらかというと、ライブラリを提供する側の視点から 1.ログを出力せよ あなたが書いたコードは遅い、と必ず言われます。なので言われる前から、自分の書いたコードの処理時間をログするようにしましょう。 次のような処理時間を計測するロガーを作ります。 var TraceLog = function (){ this.startTime = -1; var outer = document.getElementById('_outer'); if(oute
JavaScriptが、いま注目を浴びている。 JavaScriptがこれだけの注目を浴びた理由の1つとして、Ajax技術の登場とも相まって、JavaScriptに対する確かな理解の必要性が高まったという事情は否定できない。しかし、それだけでは説明できない急速な注目の理由として、もう1つ、JavaScriptという言語そのものが持つユニークさが開発者の目を引いたという点は看過できないだろう。 もっとも、このユニークさは同時に、多くの開発者が感じているJavaScriptに対する苦手意識と同義でもある。これまでVisual BasicやC#、Javaといった言語でオブジェクト指向構文になじんできた開発者にとって、JavaScriptのオブジェクト指向構文はいかにも奇異なものに映るのだ。ようやくクラスという概念を理解した開発者が、JavaScriptという言語の背後にたびたび見え隠れする「プロ
Re:href="#" onclick の悪習 ネタ元：某日記：href="#" onclick の悪習 <a href="#" onclick="...">検索</a> なんて書き方やめようぜ！というお話 a要素のhref属性に値が入ってるとonclick属性の内容を実行後にhref属性の値を参照しようとする。 #なんかが入ってるとページの一番上部にページ内遷移をする。(※1) 某日記さんの代替案ですけどspanで代替するもの <span style="cursor: pointer" onclick="...">検索</span> 私だとこんな書き方 <a href="javascript:void(0)" onclick="...">検索</a> onclickイベントハンドラを実行しようとしてるなら、こんな書き方もある <a href="javascript:（onclickの内容
Dean Edwards: Sniff! My current frog exaggerator of choice JavaScriptでIEかどうかをたったの1行で判別する方法。 なんと、次の1行だけで、isMSIE 変数に、IEで見れば true 、そうでなければ false を代入することが出来ます。 var isMSIE = /*@cc_on!@*/false; 次のサンプルコードで確認しました。 <html> <script language="javascript"> var isMSIE = /*@cc_on!@*/false; if (isMSIE) { alert('IE!'); } else { alert('not IE!'); } </script> <body> </body> </html> IEであれば IE! を alert し、そうでなければ not I
auのトップページのような、伸縮してスライドするメニューをjavascript+cssで作れるみたいです。「Image Menu」というライブラリで、動かすにはmootools.jsが必要のよう。 <script type="text/javascript" xsrc="imagemenu.js" mce_src="imagemenu.js" ></script> <div id="kwick"> <ul class="kwicks"> <li><a class="kwick opt1" xhref="" mce_href="" ><span>TOP</span></a></li> <li><a class="kwick opt2" xhref="" mce_href="" ><span>CSS</span></a></li> <li><a class="kwick opt3" xhref
5月31日に開催されたGoogle Developer Day 2007で発表され、一気に話題をさらった「Google Gears」。本稿では、そのGoogle Gearsを技術的な観点から解説したうえで、同アプリケーションを使用した簡単なサンプルをご紹介し、その魅力に迫ってみたい。なお、Google Gearsの概要については、「Google Gearsを組み込んだGoogle Readerを使ってみよう」を参照してほしい。 Google Gearsが提供するもの Google Gears(以下、Gears)は、Webアプリケーションのオフライン使用を可能にする技術である。ただし、オフラインには様々な課題がある。セキュリティ上、ローカルマシン上で好き勝手にファイルを操作したり、読みだしたりすることは許されない。アプリケーションのページをキャッシュしておくことと、アプリケーションが使用する
はじめに 「Javaアプレットなんて、もう誰も使っていない。いまさら何を…」と思ってはいませんか。 近年、Ajaxの発見によるJavaScriptの再評価は目覚ましいものがあります。コンピュータ言語学に詳しい技術者たちの間では、JavaScriptが高度なオブジェクト指向を備えている事実が知られていましたが、その能力を十分に活用した実装はほとんど見られませんでした。ところが、Ajaxが一般に周知されて以来、高度なJavaScriptライブラリも次々と登場し、多くの技術者がJavaScriptに再び注目しています。 余談になりますがLispのような古い関数型言語もまた、ここ数年で実用的な言語として再評価されるなど、このほかにも過去の技術が再浮上する例はいくつもあります。 本稿を書くきっかけとなったのは、こうしたAjaxブームの中で再浮上したJavaScriptを目の当たりにして、かつてインタ
JavaScriptとLightBoxを組み合わせたスマートな写真の見せ方サンプル「Sucke... 次の記事 ≫：花火アニメーションをJavaScriptで実装「Fireworks.js」 Ajax Back Button Hack Ajaxなページで「戻るボタン」を機能させる方法。 Ajaxなページでは、ブラウザの「戻るボタン」を押すと、通常は、前に開いていたページに戻ってしまいます。 Ajaxでページを１，２，３と開いていって、２に戻りたいのに、前に開いていたページに戻るのは利用者としては不本意な動作です。 そこで、IFRAMEを使った、Ajaxでの「戻るボタン」実装ハック方法の紹介。 Ajaxで画面を切り替えた際に、IFRAMEのsrcも切り替えることで戻るボタンを動作させることが出来ます。 例えば、javascriptで次のようにIFRAMEのsrcを切り替えます。 <ifram
サイト更新情報 2006/12/06 よく使われているページを検索窓から簡単に辿れるようにしました。(検索窓に「prototype」と入力) 2006/11/27 JavaScript入門/応用サイトJavaScriptistオープン！ 2006/11/23 試して確認できるJavaScriptオンラインエディタを公開 2006/11/20 JavaScriptリファレンス、逆引きサンプル集を公開 2006/11/19 JavaScriptライブラリ活用ページ公開 2006/11/15 JavaScriptistベース機能の構築完了 過去のサイト更新情報
GT Nitro: Car Game Drag Raceは、典型的なカーゲームではありません。これはスピード、パワー、スキル全開のカーレースゲームです。ブレーキは忘れて、これはドラッグレース、ベイビー！古典的なクラシックから未来的なビーストまで、最もクールで速い車とカーレースできます。スティックシフトをマスターし、ニトロを賢く使って競争を打ち破る必要があります。このカーレースゲームはそのリアルな物理学と素晴らしいグラフィックスであなたの心を爆発させます。これまでプレイしたことのないようなものです。 GT Nitroは、リフレックスとタイミングを試すカーレースゲームです。正しい瞬間にギアをシフトし、ガスを思い切り踏む必要があります。また、大物たちと競いつつ、車のチューニングとアップグレードも行わなければなりません。世界中で最高のドライバーと車とカーレースに挑むことになり、ドラッグレースの王冠
Webアプリケーションではもはや「実装されていて当然」といわんばかりに広まった技術、Ajax。ユーザにはひろく知れ渡ったが、実装するデベロッパには実装・保守ともにまだまだ苦労が続く状況だ。ここではそのような苦労を軽減するPHPのクラスライブラリ集としてxajaxを紹介したい。 xajaxはPHPで作成されたAjaxクラスライブラリ集。xajaxを使うことでAjaxを実現するさまざまな機能をクラスとして呼びだすことができる。比較的簡単にAjaxを使ったWebアプリケーションを作成することができるほか、既存のWebアプリケーションにたいして簡単にAjax機構を実装させることが可能だ。 xajaxはxajax projectによって開発され、GNU LESSER GENERAL PUBLIC LICENSE Version 2.1のもとで公開されているオープンソースソフトウェア。現在の最新版は4
JavaScriptテストコードのため書きっぱなしです。以下は、テキストエリアのカーソルの下に、候補窓がついてくるサンプルです。これをちゃんと書き直して、補完と組み合わせてみよう。 サンプル pre要素にborderやwidth/height、font-familyやword-spacingなど全ての属性をコピーしてテキストエリアのクローンを作り、その中のカーソルを真似たspan要素の座標を取得しています。もしかして、eventなどから簡単に位置を割り出せるのかなぁ。 カーソルの位置(文字数)はid:kosekiさんのCross Browser selectionStart/selectionEndをコピーして真似ました。 EditArea(コードが大変な感じ)も、テキストエリア(編集領域)とDIV要素(表示領域)を重ね合わせて色々なことをやってる。大量のspan要素で色づけ。 infog
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
