Simple rollover mouse effect

  • Hi there,

    On my home page – https://www.echofestival.com, if you scroll to the middle of the page I have 9 boxes – Our Family, About, Gallery etc.

    Basically, I would like to apply a simple hover-over effect which would change the opacity of the image, so that when the mouse is over the image, the image turns grey.

    Any ideas for simple simple?

    all help appreciated. Cheers

    [no bumping please]

Viewing 1 replies (of 1 total)
  • Thread Starter echofestival

    (@echofestival)

    Ok so I the following code in my stylesheet and placed it underneath the small Homepage section.

    The code:

    img:hover
    {
    opacity:0.5;
    filter:alpha(opacity=100); /* For IE8 and earlier */
    }

    Which works fine for the 9 boxes on the homepage, but it applies to all the images in the theme/website, when I only want it to apply to images on the homepage.

    Having said that, I would actually like the code to apply to all images which link to a website. Is there a small snippet which I can add to the code?

Viewing 1 replies (of 1 total)
  • The topic ‘Simple rollover mouse effect’ is closed to new replies.