これは驚きの、どんな画像もジグソーパズル化してしまうJavaScript「snapfit.js」 2009年03月19日- snapfit.js (javascript jigsaw puzzle functionality for images) これは驚きの、どんな画像もジグソーパズル化してしまうJavaScript「snapfit.js」。 JavaScriptだけでこんなことが簡単なの？と、最近はJavaScriptでもいろんなことができるから驚かなくなってきたんですが、これはたまげました。 画像があったとします。 どんな画像もパズル化しちゃいます。 パズルの難しさも選べます。 ハードレベルはかなり難しそう・・・ 使い方） 1) スクリプト読込み <script type="text/javascript" src="snapfit.js"></script> 2) imgのonl

Takanori Part: Design, Management Birthday: April 23

「InDesignの勉強部屋BBS保管庫」とかの過去ログの中にはアドビサポートデータベースやアドビサービスデータベースへのリンクがいっぱいあるのですが、このたびのアドビさんのページの改定で今までリンクされていたリンクがきちんとリンクされない…というか単に検索のページにジャンプしてしまうという感じになっているので、しかたがないのでJavaScriptでなんとかすることにした。 過去ログの内容をすべて大本から書き換えても良いのだけれども、とりあえずってことで。 やりたいこと http://support\.adobe\.co\.jp/faq/faq/qadoc\.sv\\?(...)(...)\\+.* を http://www.adobe.com/jp/support/kb/ts/$1/ts_$1$2_ja-jp.html に変える。 とか思ったらアドビサポートデータベースって4桁なのかよ！

「ruzee.com」で、HTMLのcanvas要素の中に描画できるJavaScriptライブラリ「Liquid Canvas」が公開されています。 ↑のような背景が作れてしまう、とのことですね。 デモは以下から見られます。 » Demo » basic example ブラウザはFx, IE6, Safari, Chromeでテスト済みとのことですね（ざっくりしていますが）。 ソースがダウンロードできるので、ぜひ見てみてはいかがでしょうか？ » Liquid Canvas ジョリーみたさに「トゥームレイダー 2」を見た。なかなかおもろかったね。でも最近の方がキレがある感じかな。 やること満載で混乱しています。今のサーバが海外からアクセスできない＞＜ので海外に行く前に移行しないといけなくてサーバはあそこにしようかな、とそれでメールサーバーはGoogleAppsを使おうと思ってるけどmxレコ

入れ子構造のパネルをスムーズにスライドさせる、アコーディオンの超軽量（1.4KB）スクリプトをLeigeberから紹介します。 Accordion Script With Multi-Level Support demo デモでは、親の複数のパネル、子の複数のパネル共にスムーズなスライドで開閉ができます。 スクリプトはjQueryやPrototypeなど他のスクリプトには依存せず、入れ子のパネルはリスト要素で実装されています。 テスト環境は、Firefox 2/3, IE 6/7/8, Opera, Safari and Chromeとのことです。

10 Best Free JavaScript Charts Solutions | AjaxLine JavaScript用のグラフ描画ライブラリ色々。 JavaScriptでグラフ、といっても様々なライブラリが存在するようですね。 Flot グラフ描画用のjQueryプラグイン Flotr JavaScript Plotting Library Prototype.jsベースのグラフ描画プラグイン JS charts 棒グラフなどの様々なグラフを綺麗に描画できる(一番綺麗かも) HTML-Graphs グラフをHTMLで表現するタイプ 全部見る 個人的にはグラフを表示なら画像かFlashがいいなぁと思っていますが、JavaScriptであればプラグイン非依存かつクライアント描画ということでメリットはありますね。 関連エントリ JavaScriptで小さくて可愛いグラフを作れる「jQue

このページはAjaxライブラリの1つであるjQueryライブラリを勉強したい人向けに用意されています。 jQueryはバージョンによって記述方法が異なる場合があります。ここでは、バージョン別にページを用意するようにしてあります。 Ajaxライブラリで有名なものとしてはPrototypeライブラリやYahoo UI Libraryなどがあります。jQueryはPrototypeライブラリなどと併用することもできるようになっています。 ミスや間違いなどがありましたらopenspc@po.shiojiri.ne.jpまでお願いします。 jQuery入門 (ver 1.2.1) jQuery入門 (ver 1.2.2) jQuery入門 (ver 1.2.3) jQuery入門 (ver 1.2.4) jQuery入門 (ver 1.2.5) jQuery入門 (ver 1.2.6) jQuery

Moving Boxes 枠内でワークフロー風に華麗に動作する画像ギャラリー「Moving Boxes」というものが公開されています。 なかなかカッコいいUIと動作が印象的な画像ギャラリーになっています。 画像の下にリンクを仕込むこともできるみたいです。 サンプルファイルがダウンロードできるので、カスタマイズして自由に使えそうです。 関連エントリ JavaScript製の画像スライダー・ギャラリーいろいろ 画像ギャラリーを作る際に使えるFlashやJavaScriptを活用したライブラリ＆サンプル集 超絶クールなMacスタイル写真ギャラリー「PhotoFlip」

Beautiful datepickers and calendars for web developers とても洗練されたＵＩの日付ピッカー＆カレンダー集のエントリが紹介されていましたのでピックアップ。 日付入力も便利だけでなく、クールに行えます。 datepicker シンプルだけどクールなカレンダー jquery datepicker From〜Toが指定できるカレンダー Calendar 立体的でクールなＵＩ jPint iPhoneっぽいＵＩ 全部見る たくさんありすぎて迷いますが、サイトのＵＩや、用途に応じて使い分ければ便利そうですね。 関連エントリ 超クールなカレンダー型日付入力補助用JSライブラリ カレンダー、バルーンなどWEBアプリに使えるハイクオリティアイコンセット「pinvoke」 日付入力を便利にするカレンダー/日付ピッカー集

DojoCampus Blog Archive Dojo Zoomer? 選択範囲をドラッグ＆拡大して写真の部分的な拡大ができるJSウィジェット「Dojo Zoomer」 次の図で、左に表示されている画像の選択範囲を指定すると右に拡大されるというもの。 デモ なかなか面白いですね。部分的にここをもうちょっと見たいというようなＵＩのニーズに応えてくれそうです。 関連エントリ とても大きい画像を地図アプリ風にドラッグ＆ドロップして見る 虫眼鏡を使って画像をズームする感じのUIライブラリ「TJPzoom」

border-radius.js は、class属性に値を追加するだけで、ブロックボックス要素の角を丸くするライトウェイトなJavaScriptライブラリーです。 CSSでborderとmarginを指定し、class属性に "html5jp-border-radius" を追加するだけで、角が丸くなります。JavaScriptのコードは一切必要ありません。また、このライブラリーは単独で動作するため、他のJavaScriptフレームワーク等を読み込む必要もありません。 このライブラリーは、指定のブロックボックス要素の上下に角を追加します。Internet Explorerの場合はVMLを、それ以外のブラウザーではCanvas（Canvasがサポートされていれば）を使っています。 ダウンロード Release Date Size (byte) Download

jQueryなど他のスクリプトに依存せず、シンプルなタブコンテンツを実装する超軽量（5KB）のスクリプト「SimpleTabs」を紹介します。 SimpleTabs タブとパネルは、それぞれリストとdiv要素で実装されています。 タブとパネルの対応は実装の順番通りになるため、IDなどでのコントロールは不要となっています。 また、ブラウザのクッキーを利用して、最後にアクティブにされたタブを保存し、再アクセスした際にそのタブをアクティブにします。

優雅なWeb製作者の為の『yuga.js』 Check Tweet 配布元：inputlog ライセンス：MITライセンス yuga.jsは中村 享介さんが公開されている、Web制作に役立つ機能が色々と同梱されたJavaScriptライブラリになります。Web制作を効率よく優雅に進めるためのライブラリです。 主な機能は以下の通り。 ロールオーバー時に画像に_onを追加 現在のページのリンクにclass=”current”を追加 現在のページの親ディレクトリへのリンクにclass=”parentsLink”を追加 外部リンクを別ウインドウで開く 画像へ直リンクをthickboxで表示 odd,even.empty,first-child,last-childのCSS3擬似クラスをクラスで設定 スムーズスクロール タブパネル 設置方法 ダウンロードしたファイルセット「jquery.js」、「t