Ajaxを駆使したＵＩによってオンラインWEBページ作成「Weebly」:phpspot開発日誌
Weebly - Website Creation Made Easy Ajaxを駆使したＵＩによってオンラインWEBページ作成「Weebly」 Ajaxかつ、WYSIWYGなページエディタが登録することによってWEB上で使えます。 GoogleMapをページにドラッグしたり、ウィジェットをドラッグ＆ドロップで簡単に設置できます。 デモムービーを見れば大体どんなものなのか分かるはずです。 関連エントリ オンラインで自在にCSSレイアウトをデザイン出来るサイト サイトのCSSを見たままリアルタイムに編集するツール色々 ブラウザ上で動作するJavaScript製のMSペイント「CanvasPaint」 オンラインでパスワード管理「PASSLET」
Ajaxのローディング画像ジェネレータ『AJAX LOADING GIF GENERATOR』 | CREAMU
Ajaxのあのくるくる回るロード画像を作りたい。 そんなあなたにおすすめなのが、『AJAX LOADING GIF GENERATOR』。Ajaxのローディング画像ジェネレータだ。 『AJAX LOADING GIF GENERATOR』は、ローディング画像の種類が豊富なのと、すごく簡単に作成できる点がとてもいい。色やスピードなども選ぶことができ、ローディング画像ジェネレータの決定版と言えるサービスだろう。 Ajaxのローディング画像ジェネレータ、チェックして使っていきたいですね。 ■関連記事 » MySpaceやブログ用にオリジナルゲームを作れるジェネレータ『your pics make funny games!』 » 10秒でfaviconを作成できるジェネレータ『FavIcon Generator』 » Wii用のキャラクターを作るジェネレータ『Mii Editor』 » 誘拐犯のた
Ajaxな有用コンポーネント集:phpspot開発日誌
TurboWidgets, presented by TurboAjax Group TurboWidgets are JavaScript client-side controls that provide a rich user-interface experience for AJAX-style web applications. 以前紹介した、AjaxなphpMyAdmin のページで、TurboWidgetsというAjax部品集がリリースされていたので紹介。 例えば、次のイメージはTurboGridというコンポーネント。かなりクオリティ高いです。 その他にも、次のようなプログレスバー(ぐんぐん伸びるイメージがカッコいい) 高品質なボタンコンポーネント集(一見デスクトップ風) ツリービュー(アイコン表示できる) タブコンポーネント(Appleのサイトっぽい) ドラッグアンドドロッ
Ajaxなページで「戻るボタン」を機能させる方法:phpspot開発日誌
JavaScriptとLightBoxを組み合わせたスマートな写真の見せ方サンプル「Sucke... 次の記事 ≫：花火アニメーションをJavaScriptで実装「Fireworks.js」 Ajax Back Button Hack Ajaxなページで「戻るボタン」を機能させる方法。 Ajaxなページでは、ブラウザの「戻るボタン」を押すと、通常は、前に開いていたページに戻ってしまいます。 Ajaxでページを１，２，３と開いていって、２に戻りたいのに、前に開いていたページに戻るのは利用者としては不本意な動作です。 そこで、IFRAMEを使った、Ajaxでの「戻るボタン」実装ハック方法の紹介。 Ajaxで画面を切り替えた際に、IFRAMEのsrcも切り替えることで戻るボタンを動作させることが出来ます。 例えば、javascriptで次のようにIFRAMEのsrcを切り替えます。 <ifram
AjaxとPHPな画像編集スクリプト:phpspot開発日誌
AjaxProgrammer Ajax Image Editor Using PHP I’ve decided to release the code under the GNU Lesser General Public License, so have at it! If you find it useful, I’d love to hear how/where you’re using it. AjaxとPHPな画像編集スクリプトがリリースされました。 ダウンロードして設置型で、その場で切り取ったりリサイズしたりすることが可能です。 ちょっと改造して便利にアプリに組み込めそうですね。 関連エントリ prototype.jsベースの画像切抜き用JavaScriptライブラリ DHTMLな画像キリトリスクリプト
Ajax/CSS/PHP等のチュートリアルまとめ:phpspot開発日誌
Tutorials Round-Up: Ajax, CSS, PHP and More | Smashing Magazine Ajax/CSS/PHP等のチュートリアルまとめが公開されてます。 英文のサイトは本当にチュートリアルが充実していますね。 Ajax AJAX Desktop Tutorial AJAX Matters Blog Ajax RSS reader AJAX Tutorial Ajax: What is it Good For? → 続きを読む CSS Advanced CSS Layouts: Step by Step Beginner’s guide from a seasoned CSS designer CSS Advanced Guide CSS and HTML examples and tutorials by Ove Klykken CSS Basic
Ajax Toolkit for PHP - SAJAX - Simple Ajax Toolkit by ModernMethod
SAJAX - Simple Ajax Toolkit by ModernMethod - XMLHTTPRequest Toolkit for PHP Welcome to Sajax! We've launched GLORP Visual Search Engine, a new way to search the web that's safer, faster, and best of all, 100% ad free and private. Check out an example search. Commercial consulting and support now available. Get support from the people who made Ajax easy for the masses. If your staff needs a helpin
選択中のINPUT要素をハイライトしてくれるJavascriptライブラリ「Highlight active input」:phpspot開発日誌
選択中のINPUT要素をハイライトしてくれるJavascriptライブラリ「Highlight active input」 2006年11月09日- Highlight active input This script is easy to configure. All you have to do is to define how the active input should be highlighted. This is done by CSS. Then you have to call a function at the bottom of your page to initialize the script. 選択中のINPUT要素をハイライトしてくれるJavascriptライブラリ「Highlight active input」。 実装方法は簡単で、次の通り。 1. CSSの
超簡単にソートやリサイズ、その場編集が可能なテーブルを作成できるJavaScriptライブラリ「TableKit」:phpspot開発日誌
超簡単にソートやリサイズ、その場編集が可能なテーブルを作成できるJavaScriptライブラリ「TableKit」 2007年05月31日- TableKit TableKit is a collection of HTML table enhancements using the Prototype framework. 超簡単にソートやリサイズ、その場編集が可能なテーブルを作成できるJavaScriptライブラリ「TableKit」。 次のようなExcel風テーブルが簡単に作れます。 どれぐらい簡単か、というと、必要なJavaScriptを読み込んだあと、table の class に次のように値を指定するだけ。 <table class="sortable resizable editable"> 最低幅の指定など、動作に関するカスタマイズも豊富なオプションによって指定可能です。 こ
自動で画像のスライドショーが可能なLightBox風ライブラリ「splash.image.js」:phpspot開発日誌
自動で画像のスライドショーが可能なLightBox風ライブラリ「splash.image.js」 2007年06月07日- Du cde chez Xuan - Ressources / Javascript / Splash (image plein ・ran et diaporama) 自動で画像のスライドショーが可能なLightBox風ライブラリ「splash.image.js」 画像をクリックするとそのウィンドウ内で画像を表示できるLightBoxで、スライドショーが可能なライブラリが公開されました。 右下にある、「次へ」「前へ」ボタンによって画像が送れるだけでなく、まんなかの「再生」ボタンで自動再生が可能です。 実装もLightBox同様に、必要なライブラリとCSSを読み込んだ後、アンカータグの rel 属性にグループ設定を書くだけです。 <!-- 必要ライブラリの読み込み --
画像を角丸にしたり影を付けたりできる「Corner.js」
画像の角をまるっこくしたり、影を付けたりといったことが簡単にできる「Corner.js」というのが公開されたようです。これらを組み合わせることも可能なのでかなり応用の幅は広いかと。 実際のサンプルは以下の通り。 Corner.js http://www.netzgesta.de/corner/ これはノーマル状態 グラデーションシェードを付ける 影を付ける 角を丸くする へこんだ感じの影にする そしてそれらを全部組み合わせることも自由自在 これぐらいまるくすることも可能 オリジナルのアイディアは「reflection.js」から来ているようですが、それにしてもすごい。
忘れてはいけない超絶JavaScriptライブラリ「BlueShoes:JavaScript Collection」:phpspot開発日誌
BlueShoes: JavaScript Collection Get all the above components in one package. There is an example that uses most of the components.忘れてはいけない超絶JavaScriptライブラリ「BlueShoes:JavaScript Collection」。 既に紹介したと思っていたJavaScriptライブラリであるBlueShoesの紹介。 ご存知の方も多いと思いますが、知らない人も多いようですね。 ライブラリ、というより、リッチなコンポーネント集といったイメージで、次のような様々なコントロールが使えます。 WYSIWYGエディタ Excel風スプレッドシート ツリービュー スライダーコントロール 他にも下記の様々なリッチコンポーネントが使えます。 入力系コンポーネ
入力フィールドにカーソルを合わせた際に吹出しヒント表示する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の知識のない方でも、ちょこっと変え
一味違うMacOS Xのドック風UI実現JavaScriptライブラリ「iFishEye」:phpspot開発日誌
iFishEye - An open source (free) javascript tool for creating a fisheye lens effect iFishEye is an open source (free) javascript tool for creating a fisheye lens effect. 一味違うMacOS Xのドック風UI実現JavaScriptライブラリ「iFishEye」。 iFishEyeを使えば、次のように、背景を設定した上をドック風に動かすことも可能です。 次のように2段重ねたUIを実現することも可能のようです。 滑らかに動作してくれるので、触っていてなかなか心地よいですね。 関連エントリ 超絶クールなMacOS X風ドックメニュー「CSS Dock Menu」
ページ内でpromptやconfirmの実行を可能にするJavaScriptライブラリ「pprompt.js」:phpspot開発日誌
ページ内でpromptやconfirmの実行を可能にするJavaScriptライブラリ「pprompt.js」 2006年11月29日- p0t: pprompt.js jsでデフォルトのalert, confirm, promptを単に置き換えるような単純なライブラリないかなと思って探してました。 ページ内でpromptやconfirmの実行を可能にするJavaScriptライブラリ「pprompt.js」。 JavaScriptベースのプロンプトダイアログって何か使いにくい感じがしていたのですが、このライブラリがあればその不満も払拭できそうです。 実装も簡単で、必要なCSSとJavaScriptを読み込んで、次のようにアンカーオブジェクトのonclickイベントから呼び出すだけです。 <ul> <li><a href="#" onclick="PPrompt.alert('This i
フォームの入力内容にツールチップ表示をするJavaScriptライブラリ「Tooltip for forms」:phpspot開発日誌
フォームの入力内容にツールチップ表示をするJavaScriptライブラリ「Tooltip for forms」 2006年10月22日- Tooltip for forms You can download the entire script from this Zip file フォームの入力内容にツールチップ表示をするJavaScriptライブラリ「Tooltip for forms」。 このライブラリを利用すれば、次の画像のようなツールヒントをフォーム上に出すことが可能です。 実装は、必要なライブラリを読み込んだ後、次のように、tooltipText 属性にヒントを書きます。 <input type="text" id="firstname" name="firstname" tooltipText="Type in your firstname in this box"> そして、
ドラッグ＆ドロップで複数チェックボックスの一括チェックを可能にする「Toggler」:phpspot開発日誌
Toggler Toggler is currently just a proof of concept to mimic the functionality found in desktop programs like Adobe Photoshop ドラッグ＆ドロップで複数チェックボックスの一括チェックを可能にする「Toggler」。 Togglerを使えばマウスをクリックして上からドラッグするだけでチェックボックスの一括チェックが可能になります。 使い方も次のように簡単です。 var toggle = new Toggler('elementId'); toggle.start(); // start the toggler (enabled by default) toggle.stop(); // stop the toggler これは便利ですね。
データグリッド実現用JavaScriptライブラリ各種:phpspot開発日誌
Data Grids with AJAX, DHTML and JavaScript | Smashing Magazine In order to be presented effectively, information needs structure. データグリッド実現用JavaScriptライブラリ各種。 Excel のようなデータグリッドを実現できるJavaScriptライブラリが多数紹介されています。 どれも目を見張るようなハイクオリティさ＆高機能さで、どれを使うか迷ってしまうほど。 ExtJs Grid dhtmlxGrid Phatfusion Sortable Mootable Sorting Elite Zebra Tables PHP Live Datagrid Table Kit How to paginate, sort and search a table w
タブ風ＵＩを実装するための色々:phpspot開発日誌
Tab Interface Scripts | Dr. Web Weblog タブ風ＵＩを実装するための色々。 標準的なタブＵＩから変り種タブＵＩまで、いろいろなタブ式ＵＩを実現するためのライブラリがまとまっています。 Javascript Tabs vom Stilbüro AJAX Tabs Content Script Tabmenu dhtmlxTabbar ActiveWidgets 2.0 続きをみる いろいろあって面白いですね。 関連エントリ クールなタブＵＩを簡単に実現できるJavaScriptライブラリ「LivePipe」
スクロール可能なテーブルを作成するJavaScriptライブラリ「ScrollableTable」:phpspot開発日誌
スクロール可能なテーブルを作成するJavaScriptライブラリ「ScrollableTable」 2007年03月16日- Scrollable HTML table This JavaScript code can be used to convert tables in ordinary HTML into scrollable ones. スクロール可能なテーブルを作成するJavaScriptライブラリ「ScrollableTable」。 次のようなスクロールしてもカラム名が消えず、小さいスペースで配置できるテーブルを作成できます。 （※↓は画像です） 知っておくと、レイアウトを崩さないでテーブルのようなＵＩ が必要な部分で使えそうですね。 設置方法は次の様に簡単 １．ライブラリを読み込み <script type="text/javascript" src="webtoolkit
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
