Facebook Style Background Image Upload and Position Adjustment. Facebookスタイルの画像アップロード&位置調整サンプル。 サイトのプロフィール等を等をUPする際にFacebookのUIは洗練されていますが、そのクローン。 これを参考にサイトに実装してもよさそう。 関連エントリ facebook風のSNSを独自に構築できる「HumHub」
SMINT | The simple jQuery plugin for lovers of one page websites. スクロールすると上に固定される一見普通のナビゲーション実装jQueryプラグイン「SMINT」 ページを開くと中部に何の変哲もなく現れるナビゲーションバー。スクロールするとページの上部にfixed固定され、どれだけスクロールしてもナビゲーションできて便利な物を簡単に実装できます デモはレスポンシブにも対応しているっぽいです。1ページにコンテンツを埋めこんでBookmarkによって移動させる的なページで便利に使えそう 関連エントリ レスポンシブなナビゲーションの見本やチュートリアル レスポンシブでクールなナビゲーションを実現できる「Responsive Nav」 ナビゲーションが斬新な30のサイト
stickUp - a free jQuery Plugin スクロール後、ナビゲーションをページトップに固定するjQueryプラグイン「stickUp」 最初からposition:fixedではなく、一定以上スクロールした段階でfixedにしてくれるプラグインです。 シームレスにナビが固定されるあたりがクールだったりしますが、これを簡単に実装できます。 関連エントリ レスポンシブなナビゲーションメニュー作成用jQueryプラグイン「Naver」 スクロールすると上に固定される一見普通のナビゲーション実装jQueryプラグイン「SMINT」 レスポンシブでクールなナビゲーションを実現できる「Responsive Nav」 クールな円形ナビゲーションを作るチュートリアル
gmaps.js ? the easiest way to use Google Maps ストレス無しでGoogleマップを使ったサイトが作れる「gmaps.js」 Googleマップのサイトへの実装が本当に簡単で、かつ多機能なライブラリのご紹介です 簡単なマップを出すのに必要なコードは以下。 表示させるdivと緯度経度を指定するだけです 出来ることリストは以下 マップのクリック、ドラッグ時のイベントハンドラ実装 マーカー付与 ジオロケーション・ジオコーディング マップオーバーレイ マップ上のコンテキストメニュー実装 地図上の区画指定 目的地までのルート描画 静的な画像をマップ表示 などなど超多機能。 Googleマップ使うかもしれない場合は覚えておいて損はありません 関連エントリ Googleマップ関連のjQueryプラグインとチュートリアル集 スマホやタブレットでGoogleマップ風
turn.js - The page flip effect for HTML5 HTML5で美麗なページめくり効果が作れるJSライブラリ「turn.js」 ドラッグ&ドロップでべらっとめくるあのインタフェースがHTML5で実現でき、iPadやiPhoneなどでも動作します。 電子書籍ビューアとして使えそうですね ページに立体感を出すために影なんかも描画されてます。 マークアップや初期化も超簡単です。<div>を並べて初期化するだけ。 関連エントリ HTML5で超リアルなページめくり効果を実装するチュートリアルとサンプル モバイルブラウザでのHTML5対応状況が一目瞭然の「Mobile HTML5」 HTML5/JavaScriptでテキストtoスピーチを実現できる「speak.js」
Subway Map Visualization jQuery Plugin | TechBubble 地下鉄の路線図を描けるjQueryプラグイン「Subway Map Visualization」。 もうなんでもアリか、という感じですが、次のように地下鉄マップ風のグラフィックを自由に描けるプラグインです。 ULのリストで定義していくと次のように自由に図形が描画出来ます。 東京の地下鉄を作ってみても面白いかもしれませんね。 まあ地下鉄じゃなくてもJRとかでもいい気がしますが。 関連エントリ テーブルの内容をリアルタイムにグラフ描画できるjQueryプラグイン「graphTable」 グラフ描画用のjQueryプラグイン集 jQueryベースの滑らかなグラフ描画ライブラリ「Flot」
PADILICIOUS: How to Add Finger-Swipe Support to Your Webpage iPadのブラウザ上で電子書籍風のめくる操作を可能にするJavaScript。 左から右、右から左、上から下、下から上といった指でのスライドアクションをiPadのブラウザ上で検知して好きなJavaScriptコードを実行するようにできます。 これで、本当にブラウザ上で電子書籍を読むようなインタフェースを実現できます。単純なクリックよりもよりアプリ寄りのUIがブラウザ上で実現できますね。 デモページをiPadで見てみると、それぞれ指でスライドするとページの背景色が変わるはずです。 関連エントリ iPad向けのリッチなサイトが超簡単に作成できるフレームワーク「jqpad」 iPadのサイト開発、アプリ紹介等のエントリ色々 iPad用のサイト作成に覚えておくこと色々
これは注目!jQueryでExtばりにリッチなUIが実装できる「jQuery Ribbon」 2009年05月28日- jQuery Ribbon - Home これは注目!jQueryでExtばりにリッチなUIが実装できる「jQuery Ribbon」。 利用すれば、コントロールのグルーピングや、ドロップダウンメニュー、階層リストなどのリッチなコンポーネントが実装できるみたい。 jQuery Ribbonを使ったリッチなUI。Windows7っぽいデザインのUIがJavaScriptで。 アイコン付きのかっこいいメニュー 表示しているUIのテーマを選べる アイコンつきリスト アイテムのグルーピング ドロップダウンメニュー ちょっとこれは素晴らしいですね・・・。jQueryの優位性がますます高くなってしまいましたね。 関連エントリ ナビゲーションのUIはこれで完璧かもなjQueryプラグイ
PHPプログラムを解析して何処が重いか?がブラウザ上で簡単に分かる「XHProf」 2009年03月25日- XHProf Documentation (Draft) PHPプログラムを解析して何処が重いか?がブラウザ上で簡単に分かる「XHProf」。 通常、PHPでのプロファイリングというと、Xdebugでファイルを吐き出して、WinCacheGrindやKCacheGrindで読み込むというのが定番です。 ですが、この方法だと、ファイルを吐き出したファイルをGETして、ソフトに読み込ませる、というちょっと面倒な手順が必要でした。 XHProf を使えば、ブラウザ上で、プロファイリングが出来るみたいです。 XHProfの特徴 まず、セグメントごとの実行時間やメモリ利用の状況なんかがブラウザで見れます。 プログラムの構造を把握するのにも使えます。 プロファイリングの階層表示 2つのプロファ
PHPで暗号化、ハッシュするガイドライン記事「A Guide to Cryptography in PHP」が公開されています。 ハッシュ関数の、md5, sha1や、暗号化関数のcryptなどがPHPには標準で備わっていますが、ハッシュ・暗号化のライブラリが色々と紹介されていました。 MCrypt - cryptの代替でファイルの暗号化なんかも出来るみたい MHash - SHA、HAVAL、MD4/5、TIGER、CRCなど、多種多様のハッシュアルゴリズムを提供 Crypt_Blowfish - Blowfish暗号 Crypt_RSA - RSA暗号 Crypt_ HMAC - HMACハッシュ Crypt_DiffieHellman - DiffieHellman暗号 PHPで暗号化する際の参考になりそうですね。 追記)HASH関数なんていうものも5.1.2から存在するみたい
7 Incredibly Useful Tools for Evaluating a Web Design | Six Revisions An effective web design is one in which your users are able to find information quickly and in a logical fashion. WEBデザインの評価に便利なツールが紹介されていました。 ヒートマップによってサイトのクリック位置なんかを解析できるものが色々。 ClickHeat - クリック結果のヒートマップ集計、表示用オープンソースツール よくクリックされる位置を表す、次のようなヒートマップ解析をPHP&MySQLで設置可能みたい。なんと日本語化もされている。 オープンソースなので、自由にカスタマイズしたり、ASP側の制限なんかもなくてよさそうですね。
TimThumb PHP Script Released Darren Hoyt Dot Com The script was written by Tim McDaniels as a way to achieve the core functionality of phpthumb while using half the code. 画像をサーバ側で好きなサイズにリサイズできるPHPスクリプトが公開されています。 次のようにPHPスクリプトに対して、画像ファイル名とサイズを指定することで、画像を好きなサイズにリサイズできます。 <img src="/scripts/timthumb.php?src=/images/whatever.jpg&h=150&w=150&zc=1" alt="" /> 勝手に画像の拡大縮小をされてしまう対策としてシグニチャなどを付与したほうがよさそうですが、
woork: Using CSS and Mootools to simulate Flash horizontal navigation effect カーソル位置によって自動スクロールする小窓実装ライブラリ。 枠の右端に移動すると、右にズイズイとスクロール、左に移動すると左へスクロールするような小窓を実装するためのライブラリが公開されています。 クリックでデモを表示 次のように、見えている部分と、隠している部分をCSSによって出し分けています。 JavaScriptによってスクロール処理を実装。 横スクロールしていくようなUIの実装に使えそうです。 また、サンプルのような大きいブロックではなく、小さい領域で、いくつかの情報を格納するのにも便利そうですね。 mootools+CSSで実装されているようです。
iBox - Lightweight inline popup iBox is a lightweight script that lets you overlay images and documents in a small dialog without a page reload.多機能LightBoxのiBoxがバージョンアップ「iBox v2」。 以前に紹介したiBoxがバージョン2にアップしていました。 画像、HTMLドキュメントに加えてYoutubeビデオ、インラインコンテナ(hiddenで内部に記述したdiv)を開くことができるようになっているみたい。 iBoxは依存ライブラリがなく、ライブラリ自体は7KBなので、この機能だけ使いたいという場合に使えますね。
ProtoFlow first preview release… :: Deensoft I got busy with few other client work and didn’t really get any chance to polish up the ProtoFlow widget. iTunesのカバーフロー風UIをJavaScriptで実現「ProtoFlow」。 まずはデモページを見てみましょう HTMLは次のようにシンプル <div id="protoflow"> <img src="imgs/DSCN0940_91360.jpg"/> <img src="imgs/stimme_von_oben_187192.jpg"/> <img src="imgs/Tropfen_1_Kopie_201721.jpg"/> <img src="imgs/farbraum_01
mooSlide - ajax based slider - lightbox replacement The mooSlideBox v3 is a small and slim ajax based extension or replacement of the common "lightbox" that can be found on nearly every page. This lightbox clone works in IE 6/7, Opera and Firefox. クリック後の説明文を凄くオシャレに表示できる「mooSlide」。 LightBoxの一種になると思うのですが、表示の仕方がかなりオシャレなmooSlide。 クリックしたところ、ページ下部からブロックがアニメーションして説明が表示されます。 仕組みはLightBoxでも、みせ方次第でこれだけ印象って変
PHPから各種ウェブサービスにアクセスするためのライブラリ集 2008年2月版 をまとめてみました。 2006年に「PHPからWEB2.0なAPIサービスを使う際に便利なモジュールまとめ」というエントリでウェブサービス用モジュールをまとめましたが、あれから時間が経ったので再度まとめてみました。 Services_Amazon - Amazon用 Services_Delicious - del.icio.us用 Services_Google - Google用 (古いので使えないかも) Services_Yahoo - Yahoo!Webサービス用 Services_Technorati - Technorati用 Services_Youtube - youtube用 Services_Digg - digg 用 Services_Twitter - Twitter用 PEAR::Fl
「PHPで、文字列と数値0の比較は等価になるようです」のエントリを先日投稿しましたが、その内容について詳しく調査された方からご連絡頂きました。 実際には、文字列 str が暗黙的に「0」に変換されるため等しくなる、 すべての文字列が数値「0」と等しいと判断されるわけではない、ということのようです。 文字列を'1abc'とすると0とは等しくなりません。 内容として誤解があり、ご迷惑をおかけしました。 詳しくは dara-j さんのページでまとまっているので参考にさせて頂きましょう。 追記) その他事象や、解決策などについても書かれた下記エントリも参考に出来ます 素晴らしき自動的な世界~或いは「型のない」世界~ - がるの健忘録 ピクスログ » PHPで文字列の比較を行う場合の注意 ピクスログ » [続] PHPで文字列比較を行う場合の注意と、一応数値も抑えておいたほうが・・・
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く