This wouldn't be too difficult to turn into a greasemonkey script.  It
wouldn't work for images that are hosted from a domain other than the parent
page, however, which is a frequent case; Firefox will throw canvas security
exceptions for every img element not in the domain if you do
$('img').dropper().  You could probably do a $('img').each() loop and check
that the src attribute is in the page domain before making the image
"pickable," but you would only be able to "pick" from a subset of (possibly
0) images on the page.

You could also turn it into a bookmarklet a la Karl Swedberg's jquerify
bookmarklet (same caveats apply, greasemonkey not required):

http://www.learningjquery.com/2009/04/better-stronger-safer-jquerify-bookmarklet

Scott

On Wed, Sep 16, 2009 at 5:45 PM, Jack Killpatrick <j...@ihwy.com> wrote:

>  great, thanks. This would be really handy as a greasemonkey script. I use
> a FF plugin that does the eyedropper thing a lot (during design work), but
> it has it's shortcomings. If a greasemonkey script gave me the eyedropper
> and a box with the sampled color and hex value, that'd be rad.
>
> - Jack
>
>
> Scott Trudeau wrote:
>
>
> Since github seems to be suffering from a DoS attack, I posted a demo here:
>
> http://sstrudeau.com/jquery-dropper/demo/index.html
>
> Scott
>
> On Wed, Sep 16, 2009 at 12:47 PM, Scott Trudeau 
> <scott.trud...@gmail.com>wrote:
>
>>
>> [cross posted from the plugin list, which seems to have died in
>> February]
>>
>> Hey folks,
>>
>> I've been absent from the jquery lists for quite awhile, but just
>> recently had the opportunity to build a cool little plugin for a
>> project I'm working on so I decided to release it to the public.  This
>> plugin acts as an "eyedropper"-style color picker, allowing a user to
>> select a color by clicking a pixel in an image.
>>
>> The plugin replaces selected img elements on the page with a canvas
>> element, and provides click, mousemove and mouseout event callbacks.
>> The callback is sent a color object (describing the color under the
>> mouse for the event). It also shows a little hovering preview of the
>> color near the cursor when over the image.
>>
>> You can find it on github with a simple demo included:
>>
>> http://github.com/sstrudeau/jquery-dropper
>>
>> I'm hoping to receive some feedback on things like:
>>
>> * callback function naming conventions
>> * which other arguments would be useful & appropriate to send via the
>> callback
>> * should I instead (or also) trigger events instead/as well as offer
>> callbacks?
>> * any best practice examples for making something like the color hover
>> chip style-able, optional?
>> * any other feedback
>>
>> No live demo yet -- but if I hear a clamor, I might find a place to
>> tuck one.
>>
>> Notable limitations: doesn't work on IE (the VML canvas hack doesn't
>> offer pixel-level access to images) and images must be hosted from the
>> same domain as the origin page (canvas security limitation).
>>
>> Thanks,
>>
>> Scott
>>
>
>
>

Reply via email to