5

私はこの質問と同じことをしようとしていますが、より基本的なことです。色として白と透明のみのPNG画像があります。指定された RGB 16 進数値で、透明部分に触れずに白い部分を色付けする必要があります。

これを jQuery プラグインで実現したいと考えています。これを行うことができるものはありますか?

すべての主要なブラウザー (IE、FF、GC、Safari) の最新バージョンで動作する必要があり、下位バージョンのサポートにもボーナス ポイントがあります。


使用例

ここに画像の説明を入力 ここに画像の説明を入力 ここに画像の説明を入力


私がすでに見つけた/考えたこと:

  • Pixastic、ただしクロスブラウザのサポートはありません
  • CamanJSですが、それは jQuery 用ではありません
  • hereのように別の div をオーバーレイしますが、それは透明な部分に害​​を及ぼします
  • 白い部分を透明にし、その逆にしてから背景色を使用しますが、画像はユーザーによってアップロードされるため、ユーザーフレンドリーにはなりません
4

1 に答える 1

3

代わりに SVG を使用するのはどうですか? SVG は、IE 9 以降のすべての主要なブラウザーでサポートされています。テキストベースの形式であるため、小さくて軽量で、操作が簡単です。

手っ取り早い方法は、SVG 編集(オンライン) またはInkscape<svg> (ダウンロード) を使用して図面を作成し、結果の要素を HTML ページにドロップすることです。これがどのように機能するかを示すフィドルです:http://jsfiddle.net/t6fAb/


さらに良いのは、 SVG.jsを使用して、完全に JavaScript で描画を作成することです。これがどのように機能するかを示すフィドルです:http://jsfiddle.net/WEL4J/

于 2013-07-06T16:09:16.120 に答える