IMAGE OPACITY colour effect

  • Hello
    I am using Twenty Ten and want the opacity of an image to change when a mouse hovers over it. I have used the following code in my child theme, but I want the opacity to go to a black colour not white, can anyone advise how to do this?

    Thanks

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

Viewing 3 replies - 1 through 3 (of 3 total)

  • Don’t edit the Twenty Ten theme. Instead create a child theme for your changes. Once your child theme is active, we should be able to help with the customisation.

    Thread Starter annalouis

    (@annalouis)

    hello
    I have tried a new code and set up a child theme, in the css i have added:
    a:hover img {
    filter:alpha(opacity=50);
    -moz-opacity:0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
    }
    If you look at https://www.kidsmoderndesign.co.uk, you can see the image fades to white, I would like it to go to to a transparent shade of black with the image showing through, when the mouse hovers over. Please could you advise? Thanks

    I’m sorry but it is beyond the scope of these forums to teach CSS. Try asking on a general CSS forum. I’d also recommend using Firefox with the Firebug add-on for this kind of CSS work.
    https://getfirebug.com/

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘IMAGE OPACITY colour effect’ is closed to new replies.