Results 1 to 3 of 3

Thread: Image color-change script?

  1. #1
    Join Date
    Apr 2008
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Image color-change script?

    On a website Im trying to add a clickable image:

    <a href=""><img src="img.jpg"/></a>

    What Im trying to achieve is that the image is in color. I need a script or something that displays the image desaturated / black & white, and as soon as I mouse-over, it should get its original color. I don't want to use 2 images (one in color, one black & white).

    I found the CSS property filter: gray, but it only works in IE. So maybe a javascript to manipulate the image to display it in grayscale / black & white?

  2. #2
    Join Date
    Mar 2006
    Location
    Illinois, USA
    Posts
    12,164
    Thanks
    265
    Thanked 690 Times in 678 Posts

    Default

    You'll need to use two images and do a standard rollover. The IE filters are a possible (IE-only) workaround, and so would be using Flash, etc. But browsers in general have no graphics capabilities, so this is not possible.

    You could in theory generate the image dynamically so you only have one image on the server, but that would be inefficient as that sort of processing is server-intensive and can be slow; however, you could generate them all at the same time with a script then save the images; that is a reasonable and less-work option.
    Daniel - Freelance Web Design | <?php?> | <html>| espa˝ol | Deutsch | italiano | portuguŕs | catalÓ | un peu de franšais | some knowledge of several other languages: I can sometimes help translate here on DD | Linguistics Forum

  3. #3
    Join Date
    Apr 2008
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Ofcourse, I know the option with 2 images and a rollover script. However, thats not what I wanted. I also found out the css filter property option only works with IE and I want cross-browser compatibility, so I will not use that option.

    I was thinking that maybe there was some sort of java-script that displays images in grayscales. Maybe jquery has such options? Coudn't find it on the jquery.com website though. Anyone else with some tips for me?

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •