ドットインストール代表のライフハックブログ
Script.aculo.usといえばPrototype.jsが出回った時からあるイフェクトライブラリだ。スライドでオブジェクトを表示したり(逆に消したり)、スムーズなスクロールを実現したりとユーザビリティを良くしてくれる便利なライブラリだ。 パズルのサンプル 継続的に開発が行われてきたとは言え、2008年11月の1.8.2から更新されていない。だが時代はさらに進化し、次世代のイフェクトライブラリを求めている。それがscripty2だ。 今回紹介するオープンソース・ソフトウェアはscripty2、もっと美しいWebインタフェースを実現するためのイフェクトライブラリだ。 scripty2は実に多彩なイフェクトを行える。Script.aculo.usと同じくPrototype.jsに依存する(1.6.1 RC3以降)。スクロールやイフェクトを行うライブラリはもちろん、同根されるCSSも使って表
9lessons: jQuery and Ajax best 9lessons. jQueryやPHPを使った便利な仕組みのチュートリアル集。 9lessonsというサイトがあって色々便利な仕組みのチュートリアルが公開されています。 Twitter Like More Button with jQuery and Ajax. 「もっと読む」をajaxで実現するサンプル Exactly Twitter like Follow and Remove buttons with jQuery and Ajax Twitter風のフォロー、削除ボタンを実現するサンプル Delete a Record with animation fade-out effect using jQuery and Ajax. 行を削除してフェードアウトアニメーションをさせるサンプル jQuery Username Av
com.bydust.ajaxは、スタティックなサイトでもWordPressのようなサイトでも、ページ全体のロードをせずに必要な箇所のみロードして表示するAJAX対応にするスクリプトです。 com.bydust.ajax demo デモサイトでは、右のナビゲーションや各記事のタイトルをクリックすると、通常のページ遷移とは異なり必要な箇所のみ非同期通信を行い表示します。 ※外部リンクなどは自動認識して、別ウインドウで表示します。 サイトをAJAX対応にする方法 サイトをAJAX対応にする基本的なスクリプトの設置方法は、下記の通りです。 下記は、対象となる全ページに適用します。 ダウンロードした2つのスクリプト(com.bydust.ajax.js, com.bydust.array.js)を外部スクリプトとして記述します。 HTMLの基本構造は、「id="page"」を親要素として、「id=
他のサイトが配信しているATOMやRSSフィードをJavaScriptを使って取得しようとした場合、同一生成元ポリシー(Same-Origin Policy)の制限によって直接他のサーバにあるデータへアクセスできずサーバ側でいったんフィードを受信するなどの処理が必要でした。 Google AJAX Feed APIを使用すると、Googleがフィードのキャッシュとしての役割を果たしてくれるため、サーバ側のプログラムを必要とせず、クライアント側のスクリプトだけで各種フィードを取得することが出来ます。 ここではGoogle AJAX Feed APIを使ってATOMやRSSフィードを取得する方法などを解説していきます。 Google AJAX Feed APIとは ドキュメント
dojox.fx._split Here is a small demonstration of the many possible results achievable through the relatively small set of effects currently under development. Each effect is highly configurable. Here is a general list of the options available in each effect: The number of rows and columns in which to split the element The distance the pieces travel (as a multiple of the element's respective dimens
※ 画像は公式サイトデモより Ajaxを使っている場合、その結果通知をどのように行うかは困るところだ。せっかく画面遷移のない、格好いい仕組みを使っているのに、ただ「完了しました」だけではあまりにもおざなりだろう。 右上に通知が出る 各Webサービスとも、通知のウィンドウは色々な工夫が凝らされている。自分のサイトで格好いい通知をしてみたかったら、このような仕組みはいかがだろう。 今回紹介するオープンソース・ソフトウェアはjGrowl、JavaScriptで作られたGrowlだ。 GrowlはMac OSXをお使いの方であれば知っているであろう、通知を行うためのフレームワーク的アプリケーションだ。Firefox、Cyberduck、Skypeなどなど、大抵のソフトウェアで利用されている。通知メッセージは画面の右上に表示され、時間が経過すると自動で消えていく、非常に使い勝手の良いアプリケーション
badezinerのエントリーから、AJAXコンテンツなどのローディングでよく見かけるアニメーションGIF画像を紹介します。
Ajax/JavaScriptライブラリをまとめておきます。(順不同) | 基本 | 統合 | 表示系 | GUI部品 | イメージ | PGM連携 | ブラウザ | Flash | その他 | | 部品集 | リンク | 編集履歴 | ・基本ライブラリ ・・・Ajax開発のベースになるもの ↑TOP prototype.js 超メジャーなAjaxライブラリ prototype.js の開発者向けメモ prototype.jsリファレンス prototype.jsリファレンス(JavaScriptist) prototype.js逆引きサンプル集 Prototype 1.5.0 Cheat Sheet Prototype 1.5 PDF - API/サンプル/解説 Prototype.js Documentation - まとめサイト Prototype 1.6.0へのアップグレード実例紹
Fantastic, Free Calendar and Datepicker Scripts - Six Revisions Web applications often require a calendar or datepicker functionality. 日付入力を便利にするカレンダー/日付ピッカー集。 日付だけのものから、Googleカレンダーみたいなカレンダーウィジェットまで、いろいろとあるようです。 Calendar: a Javascript class for Mootools MooMonth Monket Calendar Datejs Vista-like Ajax Calendar 全部見る これだけあれば、日付入力には困らなさそうですね。
Forms needs a solid visual structure, a profound hierarchy of form elements (Fields and Labels), powerful techniques and Functionality (AJAX) to make the form look and work creatively. There is a great bunch of creative, outstanding and individually designed from scratch forms. Thanks to AJAX, we can provide real-time feedback to our users using server-side validation scripts and eliminate the nee
JavaScript - サーバー間で双方向のRPC通信を行う技術は「Aerial」(エアリアル)という名前になりました*1。アイディアを出していただいた皆様、ありがとうございましたm(_ _)m Aerialは、通信にFlashを使い、JavaScriptとサーバープログラムとの間で双方向のRPC呼び出しを行う技術です。つまり、サーバー側からJavaScriptのメソッドを呼び出したり、逆にJavaScriptからサーバー側のプログラムを呼び出したりします。 サーバーから直接JavaScriptのコードを呼び出したり、逆にJavaScriptからサーバー側のメソッドを呼び出したりできるので、通信の内容を意識する必要がなく、バグの混入を抑えます。RPC成分入り! ライブラリを開発するときも、HTTPやブラウザ間の実装の違いを意識する必要も無く、ごく普通のTCP接続で通信を行うので、Come
高性能なインターネットアプリケーションの構築も可能なJavaScriptライブラリ「Ext 2.1」とJavaライブラリ「Ext GWT 1.0」が、2008年4月21日にリリースしました。 Ext JS 2.1 and Ext GWT 1.0 released, preview of Ext JS 3.0 Ext 2.0からの主な変更点は、バグフィックス・パフォーマンスの改善となっており、今回追加されたデモを紹介します。 また、次期バージョンのExt 3.0のデモもいくつかご紹介。 Ext 2.1のリリースの変更点は、Release Notes for 2.1.0になります。 Ext 2.1のデモ
jQuery Lightbox Plugin (balupton edition)は、アニメーションを使用して画像を拡大表示するjQueryで動作するLightbox風のスクリプトです。 jQuery Lightbox Plugin (balupton edition) デモページ 画像を拡大表示するには、スクリプトを外部ファイルとして指定し、下記のコードのようにrel属性に「lightbox」を記述します。 rel属性を変更することで表示方法を変更できます。 <textarea name="code" class="html" cols="60" rows="5"> <a rel="lightbox" href="sample-large.jpg"><img src="sample.jpg" /></a> </textarea>
Fancybox #Fancybox is the ultimate JavaScript lightbox alternative that sets the standard for premium user experience in multimedia display. Supports images, videos, maps, inline content, iframes and any other HTML content. This is the fifth generation of Fancybox. Both Carousel and Panzoom components are used under the hood and that's what makes this project so unique. In addition, Fancybox is ea
jQueryとは、JavaScriptのコーディングを強力に支援するライブラリです。 $('.semooh a').hover( function(){ $(this).text('ヌ?'); }, function(){ $(this).text('ヌー'); } );
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く