画像をスムーズに拡大縮小する超クールなjavascript『PopBox!』 – creamu
onclickやマウスオーバなどで画像をクールに拡大縮小したい。 そんなあなたにおすすめなのが、『PopBox!』。画像をスムーズに拡大縮小する超クールなjavascriptだ。 『PopBox!』は、本当にかっこいい。スムーズに拡大縮小したり、リサイズまですることができる。 「Slide an image to reveal hidden text or graphics.」のところにはしびれた。。 画像を魅力的に見せるインターフェースとしてかなり使えるのではないだろうか。 画像をスムーズに拡大縮小する超クールなjavascript、チェックして使っていきたいですね。 誕生月だったので会社でお祝いしてもらいました。久々にケーキを食べておいしかったw。 デザイナーからプレゼントをもらいました。かっこいいコンセントです！ やっぱりデザインされたものはいいな。
虫眼鏡を使って画像をズームする感じのUIライブラリ「TJPzoom」:phpspot開発日誌
valid.tjp.hu - TJPzoom 3 - JavaScript / CSS / DOM image magnifier As you may have realized, this is an image magnifier. It's a completely rewritten version of my script tjpzoom, but still is in JavaScript / DOM :).虫眼鏡を使って画像をズームする感じのUIライブラリ「TJPzoom」。 次のように、マウスの位置に従ってレンズが動作し、レンズ部分が拡大されます。 画像上をドラッグ＆ドロップでレンズのサイズを変えたり、ズーム比を変更したりすることが出来ます。 （左にドラッグでレンズ縮小、右にドラッグでレンズ拡大、上にドラッグでズーム比拡大、下にドラッグでズーム比縮小） 小さい画像と大き
あらゆるページにもっと高機能な拡大鏡を追加できる『TJPzoom.js』 - SIMPLE*SIMPLE ～ ウェブ職人のための小粋なネタ帳 ～
昨日ご紹介した「あらゆるページに拡大鏡を追加できる『Loupe.js』」の高機能版ともいうべきスクリプトをご紹介。 TJPzoomを使えば画像に拡大鏡をつけられる上、マウスドラッグでさらに拡大したり、高解像度の写真を別に用意しておいて拡大時にそっちを表示できたりします。 以下に簡単に使い方をご紹介。まずは基本パターン。 最初にスクリプトを導入。 <script type="text/javascript" src="tjpzoom.js"></script> 次に画像のコードを以下のように変更。divタグをつけるのと、widthタグをつけるのを忘れずに。 <div> <img src="test.jpg" style="width:640px; height: 480px;" onmouseover="TJPzoom(this);"> </div> なお、このほかにいくつかの画像ファイルを
画像を虫眼鏡で見たようなエフェクトをかけられる「Loupe.js」:phpspot開発日誌
Loupe.js Loupe.js and Loupe.png allows you to add a loupe (magnifier) to images on your webpages. It uses unobtrusive javascript to keep your code clean. 画像を虫眼鏡で見たようなエフェクトをかけられる「Loupe.js」。 次のように虫眼鏡でのぞいたようなエフェクトをかけられるJavaScriptライブラリです。 サイトに隠し要素を埋め込んだり、ちょっと楽しい仕組みとして応用することでサイト作成に役立てることができそうですね。
画像カーソル位置をズームインできるライブラリ「tjpzoom.js」:phpspot開発日誌
valid.tjp.hu - tjpzoom.js 2.0 - JavaScript / CSS / DOM image magnifier As you may have realized, this is a tool that brings images closer. This is the new version of my script, tjpzoom. 画像カーソル位置をズームインできるライブラリ「tjpzoom.js」。 次のように、カーソル位置の画像をズームできます。 知っておけば、ウォーリーを探せ風の簡単なゲームを作ったり、サイトのキャンペーンとしての面白い１要素として使えそう。 設置方法は簡単で、まず、次のようにスクリプトを読み込みます。 <script type="text/javascript" src="http://valid.tjp.hu/zoom2/tj
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://youmos.com/news/loupe_js
