シンプルなダミー画像から、実用的なカスタマイズが豊富に用意されたダミー画像生成サービス -Cambelt
ダミー画像生成サービスの真打ちが登場したぞ、という感じです。 画像のサイズを表記したシンプルなダミー画像から、実用的なカスタマイズが豊富に用意されたダミー画像生成サービスを紹介します。 Cambelt Cambelt -GitHub Cambeltの使い方 Cambeltのデモ Cambeltの使い方 CambeltはRubyで作成されたオンラインサービスで、img要素のsrc属性にコードを記述するだけで簡単にダミー画像を配置できます。 HTML サイズ：300x200のダミー画像を生成。 <img src="http://cambelt.co/300x200" /> 下記は、Cambeltで配置したダミー画像です。 Cambeltのデモ デモではシンプルなのものから、実用的なカスタマイズを施せるものまで、たくさんあります。 まずは、シンプルなデモから。 ダミー画像のデモ：シンプル版 サイ
顔にモザイクをかけたりできる画像プロキシ:phpspot開発日誌
Cloudinary - Blog - Automatic face-blurring in images made easy 顔にモザイクをかけたりできる画像プロキシ OpenCVを使うわけではなくて、指定サーバのURLの後に画像のURLを埋め込むだけという簡単仕様。 http://res.cloudinary.com/demo/image/fetch/e_pixelate_faces/http://〜画像のURL などと指定するだけで画像の顔の部分がモザイク化されます Cloudinary - Blog - Cloud-based API for applying effects on images 他にも色々なAPIがあるっぽい どんな言語でも簡単に扱える、このシンプルさはいいですね。
見た目はそのままで、JPEG画像のファイルサイズを1/5に軽量化するオンラインサービス -JPEGmini | コリス
JEPG画像の見た目の品質を維持しつつ、ファイルサイズを1/5に軽量化するオンラインサービスを紹介します。 ※1/5は画像によって差があります。 JPEGmini 左：オリジナル（3662KB）、右：JPEGmini（628KB） [ad#ad-2] サイトではデモのJPEG画像が4種類あり、中央のスライダーを操作することで左：オリジナル、右：JPEGmini、見た目の品質を比較することができます。
[JS]限られた領域内で大きい画像をドラッグでスライドできるスクリプト -SpryMap
大きい画像を限られた領域内に表示し、Googleマップのようにマウスのクリックとドラッグでその画像をアニメーションでスライドできるスクリプトを紹介します。 SpryMap デモページ [ad#ad-2] スクリプトはjQueryなどの他のライブラリは必要とせず、単独で動作します。 SpryMapの特徴 他のライブラリに依存せずに動作する超軽量（3KB）のスクリプト。 画像を表示する領域はピクセル単位で指定が可能。 画像を最初に表示する座標を設定可能。 スクロールのアニメーションの時間を設定可能。 SpryMapの実装 実装は簡単で、画像にidを指定して使用します。 HTML スクリプトでラッパーとなるdiv要素を追加します。divのclassはオプションで設定できます。 <img id="worldMap" src="map.jpg" alt="A map of the world." /
[CSS]サイズがばらばらで無指定の画像を一定サイズで表示するスタイルシート
画像を大量に配置するECサイトなどに便利そうな、スタイルシートのテクニックをCSSplayから紹介します。 CSS play - F.a.S.T - Fit and Shrink Technique デモ サイズはばらばらで、しかもサイズの指定をおこなっていない画像を一定の幅と高さのボックスにアスペクト比を維持したまま真ん中に表示します。 上記のキャプチャはスケールを変えているので、ぜひ元サイトのデモをご確認ください。 対応ブラウザはIE7/8, Fx, Op, Safari(PC), Chromeなど主要なブラウザのほとんどで動作します。 IE6では画像の元サイズで表示されてしまい、しかもボックスの真ん中には表示されない、とのことです。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
超カッコいいスライドショーを実装できる「iView v2.0」:phpspot開発日誌
http://www.designwalker.com/2009/12/image-optimization.html
