これは注目の超リッチなUIを実装できるjQueryベースのUIライブラリ「jQuery EasyUI」 2011年07月19日- jQuery EasyUI - help you build your web page easily これは注目の超リッチなUIを実装できるjQueryベースのUIライブラリ「jQuery EasyUI」 Ext.jsばりに美しくてリッチなUIをjQueryでも実現できちゃいます。さらに、使い勝手がjQueryなので誰でも簡単に実装できちゃいます。Extはなんとなく取っ付きにくいと感じたかたも簡単に使えそう。 サイト上のチュートリアルやドキュメントも充実していて分かりやすいです。 リッチなものが作れるのはいいけど使い方が難しかったりメンテナンス大変だと、使う気が少し失せてしまいそうですがこれなら大丈夫かもしれません。 テーマやマルチリンガルにも対応しているらし

コンポーネント満載のスマフォ向けWEBサイト作成フレームワーク「ChocolateChip-UI」 2011年04月06日- ChocolateChip-UI コンポーネント満載のスマフォ向けWEBサイト作成フレームワーク「ChocolateChip-UI」 ダウンロードしたサンプルにはかなりの量のiOSアプリ風のUIが含まれていて、これスマフォサイト用のインタフェース作成には困らないんじゃないかという感じです。 リストのUI 読み込み画面 アイコン付きテーブル ちょっとUIを変えてみる例 サムネイル付きリスト ちょっとデザインを変える 普通のリストも。 デザインを変えたリストも ラベルつきのリスト ボタンや、ON/OFFも スライダーも 背景の模様も自由に変えられます ボタンも豊富 ツールバーデザイン。アイコンを入れたり色々 更にカラフルなボタンやアイコンのみのボタンも。 タブも作れます

サーバ上で動いてるどのphpが重いか？を調べられる「PhpTop」。 「サーバ監視に超使える〜topコマンドのまとめ」というエントリで様々なtopコマンドを紹介したのですが、phptopなるものを新たに発見したのでご紹介。 具体的に出来ることは、今サーバで動いているものを指定した期間で、もっともアクセスが多いphp、CPUを多く消費しているphp、メモリを多く使っているphpといったものを降順にソートできるというものです。 サーバ上で多くのphpが動いており、どうも負荷が高いけどどれが重いのかよくわからないという場合に使えます。 top コマンドでは httpd が動いてるぐらいしか分からないので phper な方で負荷にお悩みの方は使ってみるのもよいかも。 たとえば、 $ phptop -t 15 -s mem のように実行すると、15分以内で、メモリを多く使っている順にソートが可能。

WindowsアプリのツリービューっぽいUIをWEB上で簡単実装できるjQueryプラ... 次の記事 ≫：シンプルさがいい感じの１５４種類のアイコンセット Top 10 MySQL Mistakes Made by PHP Developers PHP開発者のMySQLの間違いトップ１０。 手慣れている人にとっては知ってることも多いかもしれませんが、初心者が役立ったり、知らない部分のカバーとしてメモとして書いてみます MyISAMを使っている デフォルトはストレージエンジンにMyISAMだけどInnoDBを使おう リカバリ可能でオンラインバックアップ機能、外部キー利用可能なInnoDBおすすめ 詳細：Open database life: MyISAMとInnoDBのどちらを使うべきか PHPのMySQL関数を使っている mysql_* 関数を使わず、PDO等でストレージ変更に対応しよう

PHP Image Resizer Class : Milaju PHPで画像のリサイズ等が簡単に行えるクラスが公開されています。 こうしたライブラリは同様のものが存在するのですが、便利そうなので公開。 次のように実装時に分かりやすいコードでかつ簡単にリサイズが可能です。リサイズだけではなく、クオリティやmaxサイズといったオプション指定も出来るようになってます。 require_once('class.imgsizer.php'); $imgSizer = new imgSizer(); $imgSizer->type = "width"; $imgSizer->max = 100; $imgSizer->quality = 8; $imgSizer->square = true; $imgSizer->prefix = "sml_"; $imgSizer->folder = "_siz

jGmaps | jQuery Plugins Googleマップを使った経路案内も一瞬で実装できるjQueryプラグイン「jGmaps」 必要なライブラリを読み込んで、次のようにjgmapsメソッドを呼び出すとGoogleマップによる経路案内の地図と文字による案内情報が出ます。 $('#mapa').jgmaps( { width: 300, height: 300, directions:{ address: ['東京都新宿区', '東京都港区'], usePanel: true, panelId: 'panelDirections' } } ); 次のように、経路が地図に表示されます。 文字による案内情報も表示できます。 会社案内や会場案内なんかもこれで速攻実装できそうですね。 ダウンロードできるサンプルをいじくってみましょう。 地名に日本の場所を漢字で使う場合、文字コードはUTF-

Simple Cloud API PHPから各種クラウドにアクセスするためのライブラリ「Simple Cloud API」というものが公開されています。 クラウドといっても色々ですが、現在はストレージ用のAmazon S3や、Windows Azure Blob Storage、Nirvanixに対応しているそうです。 今後の対応予定については以下のようになってるようです。 普通のオープンソースではなく、ZendがSponsoredになっているところも注目で今後の発展が期待されます。 これは、Zend Framework のコンポーネント Zend_Cloud としても公開される予定があるとのことです。 いつクラウドを使う機会があるかわかりませんので覚えておいてもよいかもしれませんね。

ブラウザが落ちてもフォーム内容が消えないようにするjQueryプラグイン「jQuery autosave」 2010年01月19日- rikrikrik.com - jQuery autosave plug-in ブラウザが落ちてもフォーム内容が消えないようにするjQueryプラグイン「jQuery autosave」。 データを編集中にフォームに書き込んでいて、ブログ記事などが消えたりするとても悲しい気持ちになりますが、このプラグインを使えばデータをブラウザのクッキーに保存してくれて、次にアクセスした時にリストアできるという素晴らしいプラグインです。 クッキー保存のため、サーバに保存する必要はないですし、手軽に使うことができそうです（ブラウザごとにクッキーに依存した文字数制限などは存在すると思います） こういうことを１からやろうとすると結構大変ですが、毎度のことながら、jQueryプラグ

EasyUp - Simple File Uploads - Nick Brown Web Dude PHPでファイルアップロードの処理を超簡単にするクラス例「EasyUp」が公開されています。 PHPでアップロードというとそのままで簡単なのですが、後で見たときにコードがよりわかりやすくなる方法です。 次のようなコードで、ファイルを指定ディレクトリにアップロードできます。 if(isset($_POST['mySubmit'])){ include 'easyUp.php'; $up = new fileDir('/myUploads/'); $up->upload($_FILES['myFile']); } 更に削除する場合もdeleteメソッドを呼ぶだけで直感的でわかりやすい $up = new fileDir('/myUploads/'); $up->delete('pic.jpg'

PHPからTwitterを簡単に操作できるPEARパッケージ「Services_Twitter」がアッ... 次の記事 ≫：PHP関数の挙動をちょっと調べたいときに助かる「PHP Functions Online」 jQuery Form Tips Plugin フォーム要素にうっすらデフォルト値を入れてヒント表示できる「jQuery Form Tips」 フォームにデフォルト値を入れておくことで利用者が何をいれていいのか、というのが直感的にわかり、かつスペースもとらないのでよく使われる手法ですが、実装も超簡単にやりたいですね。 jQuery Form Tips を使えば、フォーム要素の title 属性に値を入れておくだけでヒントを自動表示できます。 <p> <label for="i1">Field1</label><br /> <input type="text" name="i1"

PHPでQRコード生成のためのPEARパッケージ「Image_QRCode」。 QRコード作成のライブラリは他にあったりしますが、PEARにあがったみたいです。 サンプルコードは次のように超シンプルに実装できます。 <?php require_once("Image/QRCode.php"); $qr = new Image_QRCode(); $qr->makeCode("Hello, world"); ?> QRコードがPNG画像として出力されます。 QRコードのバージョンを指定したり、出力形式をJPEGにしたり、GDのオブジェクトとして受け取ったりするオプションもあって便利そうです。 以下のPEARサイトのページを参照してください。 Image_QRCode

今年も沢山のアイコンセットを発見しましたが、2009年に発見した秀作アイコンをまとめてみました。 WEBアプリ汎用、ソーシャルアイコン、Eコマース用アイコン、その他に分類してます。 WEBアプリ汎用 Led Icon Set - Psdtuts+ MinIcons by ~kyo-tux on deviantART 32px mania Vaga Onebit free icon set いい感じのアイコンセット Project Icon Set | Dezinerfolio WooFunction: 178 Amazing Web Design Icons?|?WooThemes WP WooThemes Ultimate Icon Set ? First Release?|?WooThemes 綺麗で汎用に使えそうなアイコンセット集「Function Icons」 Icon Set b

phpコードの動作テスト時条件式作成ツールというのを作成・公開しました。 本番の環境で動作の確認をしたい場合に、自分だけ動作させるように以下のようなコードを書く場合があります。 if ($_SERVER['REMOTE_ADDR'] == 'IPアドレス') { // テストコード } この短いコードですが、(1) 条件式を書く (2) IPアドレス調べる (3) IPアドレス当てはめ、のように３ステップ踏む必要があり、書くとちょっと面倒ですね。これをスニペットとしてコピペで使えるようにしたものです。 開いただけでコードが表示されてコピペして使えるのでコードテスト時に利用すると意外に便利です。 ツールといえるほどのものではないのですが、自分用においておきましたので参考までに、良かったら使ってください。 以下のエントリを参照してください。 phpコードの動作テスト時条件式作成ツール

プリティなURLを実現するための分かりやすい.htaccessサンプル。 要は、http://site/photo.php?id=hogehoge&page=2 を http://site/photo/hogehoge/page/2/ のようにするためのmod_rewriteの設定になります。 随分前から、その真偽について色々議論されつつもSEOの常識として言われているpretty url。SEO云々もありますが、一目見て分かりやすいという点でも覚えておきたい部分ですが、その実装記述例が公開されています。 いざ実装するとなると参考になる分かりやすいサンプルまでたどり着くのが大変だったりするので覚えておいてもよいかも。 公開されている.htaccessコードは以下で、RewriteRule 部分で正規表現を使ってマッチングさせて、$1 とか $2 とかで値を渡してます。 RewriteEng

Adminer １ファイルで動作する設置が超簡単なphpMyAdmin「Adminer」。 phpでMySQL管理というとphpMyadminが定番ですが、機能が多すぎる＆ファイルが多すぎるという難点もあります。 Adminer は 1ファイルで初心者でも設置が簡単。 １ファイルで大丈夫なの？と思う方も以下のオンラインデモを見てみましょう。 オンラインデモ シンプルで動作も軽いようです。 関連エントリ PHPでMySQL管理が便利になるphpMyAdminの代わりとなるWebアプリいろいろ phpMyAdminのバージョン3.0リリース phpMyAdminの簡易版「phpMinAdmin」

Freebies Round-Up: Icons, Buttons and Templates | Smashing Magazine Visual design elements can considerably improve the readability of the page. フリーで超高品質なアイコンやボタンまとめ。 次のような超高品質なアイコンやボタンがダウンロード可能なサイトがまとめられています。 Notes Icons iMac Icons Pixel Press Icons Vista Icons Desktop Icons Browsing Dock Icons Iconfactory Freeware Icon Sets WebSiteIcons.net Toolbar Icons Crystal Clear Office Icons Shopping Cart

Notimo Demos site 利用者に対し非常に分かりやすい通知を行うためのJavaScriptライブラリ「Notimoo」。 次のリンクをクリックしてみてください。 → 通知を表示してみる ページの右上にフェードインで表示するのはなかなかインパクトが大きいですね。 スクロールしても、いやみではない感じにちゃんとついてきてくれます。 使い方もかなり簡単で、必要なJSとCSSを読み込んだ後、インスタンスをnewして show メソッドを呼び出すだけです。 showは２回連続で呼び出しても、ちゃんと１個目と区別して表示してくれます。 <script type="text/javascript"> var notimooManager = new Notimoo(); // 通知を表示 notimooManager.show({ title: 'タイトル', message: 'メッセージ

Fun With CSS Shapes - Nettuts これは驚き！CSSだけで作れる吹き出しボックス。 次のような吹き出しが、画像を一切使わずにCSSだけで実現できてしまうようです。 HTMLコードをちょっと分かりやすいようにダイエットしてみたものが以下。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <style type="text/css"> blockquote {

200 Free Exclusive Icons: Siena | Webdesigner Depot 綺麗で汎用に使えそうで商用利用も可能なフリーアイコンセット「Siena」。 次のような綺麗なアイコンセットが公開されています。 ダウンロード方法は、Webdesigner Depot のRSSフィードを登録して購読すると、該当の配信記事の中にダウンロードリンクがありますので、そこからダウンロード可能です。 関連エントリ 一風変わったブロガー＆デザイナー向けアイコンセット 綺麗なアイコン作成のチュートリアル集 アイコンを探すのに便利なサイト色々

CSS Image Maps, Redux - Flickr-like Technique? CSSのみで画像に違和感なく注釈を入れるサンプルが紹介されています。 次のサンプルを見れば、その利便性が分かるはずです。(JavaScriptは使っていません) 画像内の枠線にカーソルを合わせると説明表示