JavaScriptを使ったAutoCompleteの仕組み色々:phpspot開発日誌
20 Ready to Use Auto Completion Scripts ?|?Dzine Blog JavaScriptを使ったAutoCompleteの仕組み色々がまとまっていたので一部ご紹介。 当サイトでも過去に紹介したものが含まれていますが、こうしたライブラリは実際に使ってみると自分の理想に違ったものになっていたりするのですが、これだけ種類があれば、自分の理想に近いものが見つかりそうです。 Autocomplete AJAX Select Drowdown with ID jQuery Tag Suggest Google Suggest Style Filter with the AutoComplete Control 全部見る JavaScriptist ではベタに、prototype.js+script.aculo.us を使っています。 2006年にサイトを作っても
[JS]これ最強かものツールチップスクリプト -BeautyTips
シンプルなツールチップも簡単に実装できるだけなく、デザインのカスタマイズが可能で、対応トリガーも豊富なツールチップのスクリプト「BeautyTips」を紹介します。 BeautyTips demo BeautyTipsは機能が豊富というだけでなく、テキストや画像、AJAXコンテンツの表示、ツールチップの表示位置の自動補正など基本性能もしっかりと抑えられており、フォームエレメントへの表示、ツールチップ元の変更なども可能です。 ツールチップはcanvasで描かれており、画像は必要ありません。 対応ブラウザはIE6.x+, Fx3.x, Op8+, Safari3.xとのことで、canvas非対応ブラウザにはExplorerCanvasが使用されています。また、IE6のz-indexへの対応にbgiframe、ホバー処理にhoverIntentが使用されています。 ※Chrome 1, Fx2で
prototype.js v1.5.0 の使い方
それは何？ prototype.js は Sam Stephenson によって書かれた JavaScript ライブラリです。 この熟考の上記述された標準に準拠したコードは、Web 2.0 において特徴となるリッチでインタラクティブなウェブページを制作する際の重荷を、あなたの肩から取り去ってくれるでしょう。 もしこのライブラリを使ったことがあるなら、充実したドキュメントがこのライブラリの売りではないことに気がついたはずです。 私は他の開発者と同様に、ソースコードを読み、試行錯誤しながら prototype.js を理解しました。 自分が学んでいる間にメモを取り、それを他の人たちと共有することは価値があるのでは、と考えたのです。 加えて、このライブラリによって提供されているオブジェクト、クラス、関数、拡張機能についての 非公式リファレンス も提供しています。 ここで提供する例とリファレンス
Ajaxを勉強しよう
このページはAjaxを勉強してみたい人向けの学習用ページです。サーバーを入れ替えたため一部CGIを使用したものが動作していません。時間のある時に修正します。また、書いてから、かなり時間が経過しているため内容的に古いものもあります。ご了承ください。 Ajaxで利用されるエフェクトに関しては別ページ(Ajax Effect)に移動しました。 Ajax関連書籍に関してはAjax関連書籍一覧ページを用意しました。 Prototype系ライブラリ サンプルプログラム【New !!】のページを用意しましたので、Prototype系のライブラリを利用している方は参考にしてみてください。 ミスや間違いなどがありましたらopenspc@po.shiojiri.ne.jpまでお願いします。 第一章 Ajaxって？ AjaxとRIA AjaxとDHTML AjaxとFlash Ajaxに必要な知識と技術 Aja
Ajax なライブラリを使いまくって、自分のサイトが重くなってしまったら：Goodpic
This shop will be powered by Are you the store owner? Log in here
川o・-・）＜2nd life script.aculo.usのファイルサイズを軽減
http://www.goodpic.com/mt/archives2/2006/02/ajax.html で紹介されてる通り、script.aculo.usは通常のロードではファイルサイズが100KBを超えます。しかし、それはフルでロードしたときの容量なのです。script.aculo.usはロードするパッケージを選ぶことができる*1ので必要な機能だけを選べば良いのです。例えば、たいていの場合はscript.aculo.usのeffects.jsだけしか使わなかったりするので <script src="/js/scriptaculous.js?load=effects" type="text/javascript"></script> とすればOK。これでファイルサイズは34KBに収まります。また、二つ以上のパッケージを選択したい場合は <script src="/js/scriptac
eDevil’s weblog » Blog Archive » Javascript libraries roundup
I spent days looking for new Javascript libraries and finally made a comprehensive list of almost all libs out there. Pure JS Application libraries / Frameworks: Prototype Prototype is a JavaScript framework that aims to ease development of dynamic web applications. Homepage: http://prototype.conio.net Documentation: http://blogs.ebusiness-apps.com/jordan/pages/Prototype%20Library%20Info.htm ht
Prototype.js - Effectサンプル
これはオブジェクト指向JavaScriptライブラリ PrototypeのEffectのサンプルです。付属のサンプルにちょっと手を加えてちょっ と日本語訳したものです。 Effect.Fade() & Effect.Appear() 呼び出し方法 new Effect.Appear(element) new Effect.Fade(element) コード例 onclick="new Effect.Appear('appear')" onclick="new Effect.Fade('appear')"
リンク先はどんなサイト？ サムネイルを簡単に作り出す「Link Thumbnail」: Recently Ajax
リンク先はどんなサイト？ サムネイルを簡単に作り出す「Link Thumbnail」 最近、リンク先のサイトをサムネイル表示するのが流行っています。簡単にサムネイル画像を作る Web上のサービスがあったりするのも要因の一つですが、スクリプトで簡単に実現する方法がありました。 Link Thumbnailというこのスクリプトは、組み込めばすぐに作動して後は、class属性に定義するだけ。冒頭の画面ショットのように、マウスの位置にサムネイルが表示されます（Safariの場合は、正常に動作しませんでした）デモはこちらから。 デモarc90 lab:tools:Link Thumbnail はてなブックマークに保存 [PR] Recently Ajaxメルマガ限定、人気記事ランキング http://rakugakiman.blog6.fc2.com/blog-entry-1303.html↑こ
ruby のスクレイピングツールキット scrAPI - 川o・-・）＜2nd life
http://blog.labnotes.org/category/scrapi/ ruby でスクレイピングして web の情報を取得するのには、今まで正規表現か xpath でやってたので、わりと面倒でした。で、ふと scrAPI というスクレイピングツールキットを知ったのですが、これがかなり便利そう。 このツールキットを使うと、CSS3 なセレクタを記述することで、要素を取得することができます。たとえばとあるサイトのリンクを全部取得したければ、 require 'rubygems' require 'scrapi' require 'open-uri' require 'nkf' require 'pp' $KCODE = 'u' links = Scraper.define do process "a[href]", "urls[]"=>"@href" result :urls e
川o・-・）＜2nd life - RubyGems パッケージの作り方 - rubyforge 登録まで
日本語の解説で RubyGems パッケージの作り方や rubyforge 登録までの一連の方法が書いてあるところを見かけたことがないため、エントリーにしてみます。なれると割と簡単です。 優しい RubyGems パッケージの作り方 newgem コマンドでのひな形作成 http://drnicwilliams.com/2006/10/11/generating-new-gems/ perl には module-starter など、CPAN モジュールのひな形を作ってくれる便利なユーティリティがありますが、gem でそれにあたるのが newgem というパッケージです。 使い方は簡単で、 # gem install newgemで newgem をインストールしてから newgem コマンドを実行するだけで以下のようにひな形を作ってくれます。 $ newgem packagename c
phpied.com » Blog Archive » DB-2-MDB2
Intro Recently I had to move an existing project from using PEAR::DB to PEAR::MDB2 - the new database abstraction layer. I took notes on the parts of the code I needed to change, I hope they can benefit someone who's doing the same. Many thanks go to Lukas Smith, the lead developer, he was always responding very fast to my reports and questions in the PEAR mailing list. One thing to notice in MDB2
404 Blog Not Found:perl - Regexp::Assembleのススメ
2007年04月19日15:00 カテゴリLightweight Languages perl - Regexp::Assembleのススメ というわけで、Regexp::Assembleのご紹介。 PERL HACKS(日本語版) [英語版] odz buffer - それ Regexp::Assembleん？ループ云々を抜きにして、こういうのは Regexp::Assemble の出番じゃないの？ すでにPerl Hackers御用達のモジュールとなっていますが、まだ知らない方もいらっしゃるかも知れないので。 何をするモジュールか、といえば、以下を見れば一目瞭然でしょう。 Regexp::Assemble - Assemble multiple Regular Expressions into a single RE - search.cpan.org use Regexp::Asse
ActionScript3 でネームスペース使ったキーイベント監視ユーティリティ作りました - 2nd life (移転しました)
AS3 のキーイベント監視でなんかいい方法ないかなー、と考えていたら良い方法が思いついたので実装してみた、らかなり便利な気がするので公開してみます。 http://github.com/hotchpotch/as3rails2u/tree/master 通常のキーイベントの監視では addEventListener(KeyboardEvent.KEY_DOWN, func) で関数を登録して switch で event.keyCode 判別して Shift が押されてるか Ctrl が押されてるかによって云々、でかなりめんどくさいです。でもこの KeyTypeListener を使うと驚き300%(当社比)の方法でキーイベントを定義できます。 // 読み込んで import com.rails2u.utils.KeyTypeListener; import com.rails2u.uti
mixi Engineers’ Blog » Linux Programming、epollの話
お久しぶりです、初めての日本の夏に圧倒されているトールマエサカです。 今日はLinuxにおけるネットワークプログラミング関連のネタです。分散データベースサーバの開発過程で最近よくLinuxのepollというイベントハンドリング機能を使っています。これがまた優秀な機能なので紹介します。 このContextでいうイベントハンドラーはサーバがクライエントのリクエストを処理するためのメカニズムです。イベントの感知と通知は大雑把にいうと以下の三つの処理で構成されています： 一つもしくは複数のディスクリプタを監視 ディスクリプタの準備が整うまでハチ公のごとくひたすら待ち続ける 準備が整ったディスクリプタの通知 アプリケーションでの実装は一昔までselect(2)、もしくはpoll(2)というシステムコールで行われていました。二つとも役目は同じですがselect(2)の場合、kernelをいじらない限り
DSAS開発者の部屋:携帯ゲートウェイのIPアドレス帯更新を効率的に確認する方法
携帯電話各キャリアは、そのゲートウェイのIPアドレス帯域を公開しています。 DoCoMo au SoftBank WILLCOM 携帯ブラウザからのアクセスの場合、このIPアドレスがソースアドレスとなるので、アクセス制御や判別のために使っている方は多いのではないかと思います。 今回は、このIPアドレス帯の更新を効率的に確認する方法についてのお話です。 更新されたかどうかの確認だけならアンテナ系のWebサービスを使えばよいのですが、それだけだと、 どのIPアドレス帯が追加・削除されたのかわかりづらい。 IPアドレス帯のコピペが面倒くさい。 といった不満点があります。 そこでNet::CIDR::MobileJPというPerlのモジュールの出番です。(作者はモバイルファクトリという会社の方のようです) このモジュールには与えたIPアドレスが携帯かどうかを判別する機能があるのですが、次のようにす
マッシュアップに必須！PHPで複数APIを同時に叩いて超高速化するサンプル:phpspot開発日誌
phpied.com Blog Archive Simultaneuos HTTP requests in PHP with cURL The basic idea of a Web 2.0-style "mashup" is that you consume data from several services, often from different providers and combine them in interesting ways. マッシュアップに必須！PHPで複数APIを同時に叩いて超高速化するサンプル。 通常、PHPでAPIにアクセスする場合、例えば、Yahoo!検索APIとはてなブックマークのRSSを取得してマッシュアップする場合は次の図のようになります。 ただ、この方式だと、Yahoo!検索APIにリクエストし、その結果を待ちます。 そして、そこからはてなブック
jQuery 日本語リファレンス
jQueryとは、JavaScriptのコーディングを強力に支援するライブラリです。 $('.semooh a').hover( function(){ $(this).text('ヌ？'); }, function(){ $(this).text('ヌー'); } );
tokuhirom blog
Blog Search when-present<#else>when-missing. (These only cover the last step of the expression; to cover the whole expression, use parenthesis: (myOptionalVar.foo)!myDefault, (myOptionalVar.foo)?? ---- ---- FTL stack trace ("~" means nesting-related): - Failed at: ${entry.path} [in template "__entry.ftlh" at line 3, column 25] - Reached through: #include "__entry.ftlh" [in template "entry.ftlh" at
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
11月11日の技術勉強会 - はてな技術発表会日記 - 機能変更、お知らせなど