Asual » SWFAddress
SWFAddress is a small but powerful library that provides deep linking for Flash and Ajax. It's a developer tool, allowing creation of unique virtual URLs that can point to a website section or an application state. SWFAddress enables a number of important capabilities which are missing in today's rich web technologies including: Bookmarking in a browser or social website Sending links via email or
ボックス要素をレンガ状に綺麗に整列させる「jQuery Masonry」が凄い:phpspot開発日誌
ボックス要素をレンガ状に綺麗に整列させる「jQuery Masonry」が凄いです。 普通、高さの違うボックス要素を float とかで並べると次のような、どう見ても見れない崩れたデザインになってしまいます。 が、今回紹介するjQuery Masonry を使うと、次のように、綺麗にテトリスっぽく整列できてしまいます。 ↓↓↓↓↓↓↓↓↓↓ これを実現するのに必要なJavaScript コードは以下のように数行。これで実現可能です。 $('#primary').masonry({ columnWidth: 100, itemSelector: '.box' }); この仕組みを使ってブログ等を表示するともっと面白いことになります。 新聞っぽくなりましたね。 ブラウザ幅を変える事でいろいろな見え方になるのも面白いです。 以下のエントリを参照してください。 jQuery Masonry ? B
グーグルのJavaScriptツール集大成「Google Closure Tools」
2009年11月5日，Googleは自社サービス製品であるGmail，Google Maps，Google Docsなどの開発に使用しているJavaScriptアプリ開発ツール群「Google Closure Tools」を一般公開しました。 "Closure"は一般的に，閉鎖や閉店といった意味で使われます。ツールの命名としては少しネガティブなニュアンスを感じますが，Google Closure Toolsの場合は，終結といった意味で，開発プロジェクトにおける最終ステップの仕上げ用ツール。すなわち“栓”という意味で中身があふれ出さないようにキッチリ閉めておくものといった意味合いから命名されているようです。 Ultimate（究極）に近い意味でGoogleの自信の表れと受け取った方がいいかもしれません。Googleで新規公開になったプロジェクトとしては珍しく，ベータ版の表記もありません（Go
JavaScriptツール&ライブラリ50選 | エンタープライズ | マイコミジャーナル
Smashing Magazine - WE SMASH YOU WITH THE INFORMATION THAT WILL MAKE YOUR LIFE EASIER, REALLY. Smashing Editoria氏がSmashing Magazineにおいて50 Fresh JavaScript Tools That Will Improve Your Workflowのタイトルで50のJavaScriptに関連したツールやライブラリを紹介している(実際には51)。RIA開発においてJavaScriptは重要な地位を占めつつあり、適切な開発ツールやライブラリ、フレームワーク、プラグインを選択することは、迅速で効果的な開発を実現するために欠かせない。紹介されているツールやライブラリは次のとおり。 JavaScriptツール FireUnit (Firebug向けJavaScrip
AJAX APIs Playground
Google APIs Explorer Stay organized with collections Save and categorize content based on your preferences. The Google APIs Explorer is a tool available on most REST API reference documentation pages that lets you try Google API methods without writing code. The APIs Explorer acts on real data, so use caution when trying methods that create, modify, or delete data. For more details, read the APIs
JavaScriptでかんたんAIRアプリに挑戦 - ぼくはまちちゃん！
こんにちは！ みなさんガジェットつくってますか！ なんだか最近、色々な種類があるみたいですね！ Yahooナントカとか、Googleガジェットとか、Adobe AIRとか、シルバーナントカとか、あとWindowsサイドバーだとか…。 こういうガジェット的な、ちょっとしたデスクトップ用のツールって、 どうやってつくるのかなーなんて思って、ちょっと調べてみました！ そしたら意外と簡単だった…！ これならぼくにも作れそう！！ ってことで、ちょっとメモしておきますね！ どれにしようかな…！ つくるのが簡単なこと WinでもMacでも動いてほしい 使う人がインストールしやすそうなのがいい こんな感じで考えていくと… 最終的に、Googleガジェット か AIRなのかなー、ってことになりました！ でも実際ぼくはGoogleガジェットなんて使ったことないし…！ (なんとなくGoogleデスクトップとかも
魅力的なウェブサイトを作成するために知っておくと便利な9つのスクリプト - GIGAZINE
個人的なウェブサイト作成や仕事としてウェブサイトを作成している人だけでなく、何かのサイトを発注して作ってもらう際などにこういうのを知っておくと、かなりはっきりと具体的なイメージを相手に伝えやすくなるので、スムーズにコミュニケーションできるはずです。あるいはクライアントにこれらのリソースの存在を認知してもらうことで、話が進めやすくなるかもしれません。 というわけで、魅力的なウェブサイトを作成するために知っておくと便利な無料の各種スクリプトは以下から。 Woork: Useful resources and tutorials for developing stunning web sites 1. ModalBox http://www.wildbit.com/labs/modalbox/ Web2.0スタイルのダイアログボックスなどを表示させることができます。Mac OS Xのダイアログボ
Safari4 と IE8 で実装された DOM Storage とは何か - IT戦記
はじめに 皆様 JavaScript のスピード競争が激化し、 ECMAScript 3.1 の仕様の策定が進むなど、激動の JavaScript 時代をいかがお過ごしでしょうか。 さて今日は、今、ちまたで大ブレイクの兆しを見せている DOM Storage という仕様を紹介したいと思います。 DOM Storage とは何か まず、 DOM Storage とはどんなものなのでしょうか。 とても簡単に言ってしまえば、とてもたくさんのデータが保存できてサーバーに自動で送られない Cookie みたいなものです。 さらに、 Cookie とは違って JavaScript からとても扱い易く作られています。 では、この DOMStorage の具体的なソースコードを見てみましょう。 <!DOCTYPE html> <html> <head><title>DOMStorage の使い方</tit
たった6行でWebサイトのUIをガラッと変える
「こんな長いWebページ、まったく読む気がしない」。Webサイトを閲覧していてこんな経験をしたことは誰しもあるのではないだろうか。一方で、Webサイトを作る側にとっては、どこまでを1ページにまとめるかは常に悩むところだと思う。長いからといってむやみにページが分割されているのも考えもので、今度は「次のページへ」ボタンをクリックするのが面倒になり、ストレスがたまる。 CogniTom Academic Designが作った「bookreader.js」は、そんな悩みを解決してくれるかもしれない。bookreaderは、本や雑誌をめくるような感覚で、Webページの本文を横にスクロールさせるJavaScriptライブラリだ。 「bookreader.js」のWebサイト。サイト自体がbookreader.jsを使ったデモサイトを兼ねている。中央にある [<] [>] をクリックすると1ページずつ、
Adobe Acrobat 7.0例文辞典
Adobe Acrobat Professional 7.0 (PDF関連) のJavaScriptのサンプルを主に扱っています。 動作の確認はMacOS X (10.3.x, 10.4.x)とAdobe Acrobat Professional 7.0で行っています。このためWindows版およびStandard版、Elements版で問題なく動作するかどうかは未確認です。あらかじめ、ご了承ください。また、次のバージョンアップによって動作しなくなるサンプルもあるかもしれません。 MacOS X版でもver 7からSafariブラウザ内にPDFが表示されるようになりましたが、その場合の不具合および動作の検証は、まだ行っていません。正しく動作しない場合には、Safariブラウザ内でなく通常のPDFとして保存しAcrobat 7で開いて実行してみてください。 このサイトに関するお問い合わせは
Ext JSとprototype.jsで作るリッチなUI（1/4） ─ ＠IT
Ext JSとprototype.jsで作るリッチなUI：パターンとライブラリで作るAjaxおいしいレシピ（3）（1/4 ページ） 今回は話題のExt JSを使ったサンプル Ext JSはAjaxアプリケーションを構築するためのJavaScriptライブラリ（フレームワーク）です。Ext JSを使用することで、デスクトップアプリケーションのようなユーザーエクスペリエンスを提供できます。2007年10月11日に2.0のベータ版がリリースされ大変注目を集めました。 今回はそのExt JS 2.0のベータ版を使ったサンプルを紹介していきます。 ■ ごく普通の入力フォームのサンプル まずこちらのサンプルを見てください。 今回のサンプルプログラム（拡大表示はこちら、※注意1：FireBugを有効にしている場合は動作が重くなる場合があります。一時的にFireBugをオフにして利用されることをおすすめし
IT戦記 - 一行で IE の JavaScript を高速化する方法
以下の一行をすべての 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 -
テーブルをソートできるようにするjsライブラリ-table sorting
テーブルをソートできるようにするjsライブラリ-table sorting table sortingはテーブルをソートできるようにするjsライブラリです。 テーブルの内容でソートしたり、奇数行、偶数行にそれぞれ異なるclassをつけたりが可能です。 設置方法 ダウンロードしたsortable.jsをhead要素内なので読み込みます。 <script type="text/javascript" src="sortable.js"></script> ソートの対象のtable要素のclass属性をsortableに設定して、任意のID名をid属性につけます。 <table class="sortable" id="foo"> ソートの対象にしたくない列がある場合はth要素のclass属性にunsortableを設定します。 <th class="unsortable"> ソートの対象にした
メアドをスパムに利用されないように暗号化する「emailProtector.js」 - GIGAZINE
ブログやページ上に連絡のためにメールアドレスを表示しておきたいけれども、そうすると今度はスパムメールを送信しまくるためのメールアドレス回収ボットの餌食になってしまいかねないし、だからといって画像で表示すると利便性が低下するのでなんだかな～、と悩んでいた人に朗報です。 この「emailProtector.js」を使うと、クリックすればちゃんとメールソフトが起動するタイプのリンクを作成することができ、しかもその文字列は暗号化されているのでボットには回収されないという仕組み。なかなかよくできてます。 ダウンロードと使い方は以下から。 Email Protector 実例は以下のページの「Click to email me」をクリックすればわかります。また、この「Click to email me」のリンクURLをコピーするか、直接ソースを見れば暗号化されているのがよくわかります。確かにコレならス
入力フィールドにカーソルを合わせた際に吹出しヒント表示するCSS＆JavaScriptサンプル:phpspot開発日誌
Form field hints with CSS and JavaScript (Ask the CSS Guy) My co-workers pointed out a nice effect on the Vox registration form. 入力フィールドにカーソルを合わせた際に吹出しヒント表示するCSS＆JavaScriptサンプル。 次のように、入力フォームにカーソルを合わせた時点でそのフィールドのヒントを表示できます。 フォームの入力フィールドの下に説明を書くよりも、ポップアップしてヒント表示したほうがユーザビリティ的によさそうですね。 要素の表示/非表示処理をJavaScriptによって行っていて、綺麗なHTMLによる実装が可能な点もいいです。 また、サンプルが1ファイル＋画像1枚とシンプルなので、あまりJavaScriptやCSSの知識のない方でも、ちょこっと変え
Litebox- Same great taste, less calories
Litebox Check out the front page If you haven't been to the front page in some time, check it out. I've started blogging about some tips and tricks. Expect some full featured scripts some time soon. What is it? Litebox is a modified version of Lightbox v2.0 created with one thing in mind, size reduction. Litebox utilizes the 3kb javascript library moo.fx in association with prototype.lite, giving
GIGAZINE - 画像を使わず、角にアンチエイリアスをかけて丸くする「curvyCorners」
「curvyCorners」はフリーのJavaScriptで、角が丸いコーナーをDIV要素で簡単に作ることが可能。特徴は画像を使ったのと同じくらい角がなめらかに丸くなる点と、いたって利用が簡単な点。 どれぐらい丸くなるのかという実例とコードのダウンロード、設置方法は以下を参照。 例その1、3ピクセルの白いボーダーを使い、角は半径20ピクセルで丸くなってます 例その2、固定幅と高さで画像を固定し、角は半径20ピクセルで丸くしている例 ダウンロードはこちらから 使い方は以下を参照 http://www.curvycorners.net/ ほとんどのメジャーなブラウザをサポートしているので汎用性も高く、使い勝手もいい感じです。
JavaScriptオンリーで動く高速サーチエンジン＆タグクラウド:phpspot開発日誌
Tipue JS Tipue JS is an Open Source JavaScript site search engine. It works with any browser that supports JavaScript and at least partially supports the W3C DOM Level 1. JavaScriptの高速サーチエンジン、Tipue JS。 JavaScriptのみで動作するのでサーバーサイドでの検索処理は不要。 但し、tip_data.js というファイルでデータを持っておき、ブラウザに読ませる必要があります。 現在の所、日本語は通らないようですが、なかなか面白いプログラムですね。 図） Tipueによる検索結果画面 もう一つ。 同じサイトで配布されているCloud JSが面白いです。 Cloud JS Cloud JS use
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
holy-grail.jp