ajax-tooltip.js でマウスアウトしても吹き出しが消えないように改造 (ラボブログ)
ラボ神部です。 ちょっと機会が会ったので、ajax-tooltip.js の設定方法と、マウスアウトしても吹き出しが消えない方法についてまとめたのでブログにコピペしておきます。便利ですよ！ ▼1.ライブラリの取得 Ajax tooltip http://www.dhtmlgoodies.com/index.html?whichScript=ajax-tooltip に行き、次の zip ファイルを取得 http://www.dhtmlgoodies.com/scripts/ajax-tooltip/ajax-tooltip.zip ▼2.フォルダの配置 zip ファイルを解凍し、任意の場所に、css, images, js フォルダを配置 （できればコンテンツのルートフォルダに） ▼3.HTML に追加 ポップアップを使用したいページのヘッダ（の間）に、下記の行を追加する <sc
JavaScript+Flash の画面イジリ系を調べていたらあの天才に遭遇！ (ラボブログ)
スパイスラボ神部です。 今日はちょっと前に流行った画面崩壊について調べていました。Wario Land: Shake It – Amazing footage! とか、ワリオランドシェイクみたいに HTML が崩壊するブックマークレット（とそのソースコード） - てっく煮ブログあたりのやつですね。 しかしこれよりも前にもっとすごいやつ（画像だけではなく文字も崩壊しちゃう）ものがありまして、いったい誰がつくっているのかなーと不思議に思っていました。具体的には、 -映画「ハプニング」オフィシャルサイト の右にあるブログパーツ -映画「シャッター」オフィシャルサイト の右にあるブログパーツ あたりです。 これってどうやってるのかなー、と前から気にはなっていたのですがソースコードが追えず分からずじまい。しかし、これらのブログパーツをさがしていたところ、なんと制作者とおぼしき本人のブログをはてなダイ
JavaScript はどのように実行されるか - IT戦記
JavaScript はどのように実行されるか Safari*1 の実装を例に JavaScript はどのようにして実行されているかを書く。自分用のメモ。日本語の出来は気にしない 1. ブラウザを起動して以下のようなページを開いたとする <html> <head> <script> var a = 1; var b = 2; alert(a + b); </script> </head> <body> </body> </html> 2. インターネットからデータが到着する そうすると WebCore::FrameLoader::write という関数に生の文字列が渡される。型は char* だ。 http://trac.webkit.org/browser/trunk/WebCore/loader/FrameLoader.cpp#L990 この関数の中では、到着した文字の文字コードを解
FlashではなくjQueryで！インパクトのあるUIを作ろう (1/5)
もう間もなく投開票を迎える米国の大統領選挙。候補者である共和党のジョン・マケイン氏、民主党のバラック・オバマ氏の両者のWebサイトを見ると、インターネットを重要な選挙ツールとして位置づけていることが伺えます。ネットを使った選挙活動が制限されている日本とは事情が異なるせいもあるでしょうが、両者ともに公式サイトの充実ぶりがすごいのです。ブログや動画の活用は当たり前。グッズのネットショップや、サポーター向けのコミュニティ機能など、ちょっとしたポータルサイトのような凝った作りです。 そんな気合の入ったWebサイトだけに、デザインの面でも参考になる面が多々あります。今回は特に、Ajaxを活用したユーザーインターフェイスを持つ、オバマ候補の公式サイトをお手本とさせていただきましょう。 今回のお手本サイト： 『Barack Obama and Joe Biden』 11月4日に開催される米国大統領選挙に
様々なブックマークをミックス！ - チャートマニアックス
チャートマニアックスを使うと、様々なサイトのアクセスチャートを見ることができます。
ブラウザ毎の getComputedStyle の戻り値 - latest log
currentStyle, getComputedStyle() が返す値を調べています。 getComputedStyle() は、描画に使われるスタイルに(近い)値を取得する便利なメソッドです。 currentStyle は IE と Opera で使用できる JavaScript プロパティですが、やる気の無い値(widthで"auto"を返す等)を返すことでも有名です。 color: Browser gray skyblue #C0FFEE transparent 評価 Firefox2 rgb(128, 128, 128) rgb(135, 206, 235) rgb(192, 255, 238) rgb(0, 0, 0) Firefox3 rgb(128, 128, 128) rgb(135, 206, 235) rgb(192, 255, 238) transparent ○
「Norton 2009」は無重力並みの軽さ!? “体験”ツアーで盛大にPR
米Symantecは13日、世界各国のブロガーと報道関係者を米国ラスベガスに招待して、無重力飛行の体験ツアーを開催した。「Norton Internet Security 2009」および「Norton Anti Virus 2009」の発売を記念したイベントで、PCの性能に全く影響を与えないことを目指した「ゼロインパクト」という同製品のセールスポイントを盛大にアピールした。 ● ゼロインパクト＝無重力？ 無重力体験ツアーは、ジェット機が一定の放物線を描いて飛行することで、宇宙と同等の無重力状態を機内に発生させるもの。ジェット機は、高度約7315メートルから約1万360メートルまでの間を15回にわたって放物線飛行し、放物線の最高点前後の約30秒間（合計で8分程度）で無重力状態を体験できる。 正直に言って、Norton 2009がPCの性能に与える負担がないという「ゼロインパクト」と「無重力
【速報】IE8 Beta 2 で DOM オブジェクトに対して Getter / Setter を追加できるように！ - IT戦記
さっき IE8 Beta 2 が出ましたね！ ということで、インストールをしてみました！ で IE8 Beta 2 の DOM オブジェクトに以下の Getter Setter 用の関数群を発見！ __defineGetter__ __defineSetter__ __lookupGetter__ __lookupSetter__ ちゃんと動いている見たいです！ これは本当にすごいです！感動！ var body = document.body; // IE にだけ存在しない // textContent プロパティを body に作ってみる body.__defineGetter__( 'textContent', body.__lookupGetter__('innerText')); body.__defineSetter__( 'textContent', body.__lookup
次の JavaScript の仕様はこうなる！ ECMAScript 3.0 から 3.1 への変更点まとめ - IT戦記
はじめに JavaScript の標準仕様である ECMAScript 3rd Edition (ECMAScript 3.0) が 9 年ぶりにバージョンアップしようとしています。 実は、これまでも様々なバージョンアップの案が上がっては消え、また上がっては消えていました。 しかし、今回のバージョンアップには今までと違う点が一つだけあります。 それは、現時点での主要な ECMAScript インタプリタ（JavaScript の実行エンジン）を作っている全団体（以下を参照）がこの仕様に同意したことです。 Mozilla (Firefox) Apple (Safari) Microsoft (Internet Explorer) Opera (Opera) Adobe (Flash) Yahoo (Yahoo Widget) Google この同意は JavaScript のこれからを大きく
ブラウザのバージョンアップをさりげなく促してくれる『Pushup The Web』 | 100SHIKI
ブラウザのバージョンアップをさりげなく促してくれる『Pushup The Web』 July 30th, 2008 Posted in 便利ツール（ウェブ） Write comment サイト製作者にとっては、訪問者がなるべく新しいバージョンのブラウザを使っていてくれるとうれしいものだ。 新しいブラウザであれば新しい技術を使った素敵な見せ方ができるからだ。 ただし、ぶっきらぼうに「古いブラウザーでは見えません」とか「このサイトは○○用に最適化しています」とかいうのはいただけない。 そこで登場したのがPushup The Webだ。このサイトで配布されているJavaScriptを設置するだけで、サイトの右上の方に「新しいバージョンのブラウザがあるようですよ」とお知らせしてくれるのだ。 しかも「いや、すぐにアップグレードはしないなぁ」という訪問者のために「6時間後にリマインドする」といったオプ
プログラミング未経験者が JavaScript でプログラミングを始めるまでに必要なこと - IT戦記
（執筆中） （文章の練習も兼ねてぐだぐだと執筆中、現時点で読んでも日本語になってないと思います。） （執筆途中だけど、こうしたらいい！とか、アドバイスがあれば教えてください＞＜読者みんなが編集者！とか言ってみる） （あ、はてな記法のパッチを送ってくれてもいいです＾＾） （ちょっと、 Shibuya.JS in Kyoto → PHP カンファレンスがあるので、次の更新はそれ以降になるかも） 自分の知り合いに「まったくのプログラミング未経験だけど、自分のウェブサイトを作ってみたい！」という人がいるので、プログラミングを始める前に必要な知識や心構えや準備などを書いておこうと思います。もちろん、最初に使う言語は JavaScript です。 この文章は、プログラミングまったくの未経験者が読んで分かる文章を目指しています。もし、分からない部分がある場合は指摘してください。聞いてください。自分で調べ
"+="でも不十分、IEで性能発揮するには文字列サイズにも工夫必要 | エンタープライズ | マイコミジャーナル
Tom Trenka氏は以前SitePenにおいてString Performance: an Analysisというタイトルのもとで興味深いドキュメントを公開した。同ドキュメントはdojox.string.Builderのパフォーマンスを改善することを目的として行われた分析の結果をまとめたもので、JavaScriptプログラミングには欠かせない興味深い結論が導き出されていた。 これまでのテクニックに従えば、文字列は一旦配列に分解してから操作をおこない、最後に文字列に戻した方が処理が高速になると考えられてきた。以前のIEであればその貧弱な文字列処理性能やGCの動作の影響でそれは事実だったが、最近のWebブラウザでは改善されており配列に分解するよりも"+="で連結した方が処理が高速になることが明らかになった。これがString Performance: an Analysisでの主な結論だ。
文字列から正規表現を生成するときのメモ - IT戦記
base2 のコードを見ていたら便利そうだったのでメモ http://code.google.com/p/base2/ 文字列から正規表現を作るとき RegExp("^hoge$"); // hoge とマッチ RegExp("^\\\\$"); // \ とマッチ RegExp("^\\[hoge\\]$"); // [hoge] とマッチ という感じで、バックスラッシュをいっぱい書かなければいけないので 以下のような関数を用意してやって function _r(str) { return (str + '').replace(/([\/()[\]{}|*+-.,^$?\\])/g, "\\$1"); } こんな感じで match(RegExp('^' + _r(prefix) + 'unko'), 'unko'); めもめも
その長さがどれぐらいかをとってもわかりやすく説明してくれる『Sensible Units』 | 100SHIKI
説明する、という行為は「未知を既知に結びつける行為」である。 そういう意味ではSensible Unitsは素晴らしいのではないか。 このサイト、「50メートル」「20インチ」などの長さを実にわかりやすく説明してくれるツールだ。 50インチだったら「サッカーボールの直径ぐらい」といった具合にイメージしやすく変換してくれる。 今は長さだけだが、将来的には重さとか他の単位にも是非拡張してもらいたいところだ。 日本語版もあると良いかもですね。 管理人の独り言 『二日酔い・・・』 昨日は午前3時すぎまで呑んでいて今朝はえらい二日酔い。あの二人はそういえばあの後どうなったのだろう・・・と、そんなことを思いながら起床。朦朧となりながらもケータイ会議告知の準備。そのあと友人二人を会わせるためにランチ。恵比寿のタイ飯で癒される。アロイマックマック。思いのほか話がもりあがった。おもしろい人はいいですな。「モ
Web APIって何？
Web APIとJSON Web上ではネットショッピング、ブログ、SNSなどさまざまなサービスが提供されています。これらのサービスの中にはWebブラウザから利用するだけでなく、サービスの機能の一部をプログラムから利用可能なAPI（Web API）として提供しているものもあります。Web開発者はWeb APIを利用したアプリケーションを開発したり、既存のWebサイトにWeb APIを利用した機能を追加することなどが可能です。 なお、Web APIを使用し、複数のサービスの機能を組み合わせたり、独自の機能を追加したサービスを構築することをマッシュアップと呼びます。 これらのWeb APIの多くはXMLで情報を返すものが多いのですが、中にはJSONで情報を返却するWeb APIも存在します。そこで、今回はJSONを使用するWeb APIの利用方法を紹介します。 Ajaxのクロスドメイン制約 しか
【PHP TIPS】 81. ブログパーツを作ってみよう：ITpro
ブログパーツと呼ばれるものをご存知ですか？ ブログペットや地図日記など、ブログ上にスクリプトタグを埋め込むことで別サーバーのコンテンツを表示するモノです。 このようなブログパーツでは、下のようなスクリプトタグを埋め込むことでコンテンツを表示させることが多いです。 <script type="text/javascript" src="http://www.example.com/script.js"></script> 今回はこういったブログパーツの基礎部分をつくってみましょう。サンプルでは単純に「Hello World!」を表示させます。ブログに貼り付けた上記の<script>タグ部分が「Hello World!」に置き換わるサンプルです。 まずは、貼り付けるブログに表示したいHTMLタグを書き起こします。 <div> <p>Hello World!</p> </div> これをブログに
XMLHttpRequestでRefererをセットする - FAX
JavaScript 追記Firefox 3.0で確認したところエラーになった。 Firefox 2.0.0.13で確認しました。 var url = 'http://localhost:8080/index.html'; var referrer = 'http://www.hatena.ne.jp/'; var req = new XMLHttpRequest(); req.open('GET', url, true); req.onreadystatechange = function(){ // 1: 読み込み中 if(req.readyState == 1) req.setRequestHeader('Referer', referrer); // 4: 準備完了 if(req.readyState != 4) return; console.log(req.responseTe
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
DAIKO Creative Workshop2009 クリエイティブにらめっこ
画像ぶっこ抜み.in
画像ぶっこ抜き.in