Not signed in (Sign In)

SkillShare - A place to discuss Web Standards and Web Design topics

Categories

Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.

    • CommentAuthorNopox
    • CommentTimeJan 10th 2011
     permalink
    Hi,
    I want to create a hover effect on the image that allows me to reduce the
    transparency on mouseover. This image, however, is contained in another
    div that sets a transparency of 60%.

    In practice:
    my html code is:

    <div class="rettangolo">
    <div class="immagine">
    <a><img src="a.png"></a>
    </div>
    <div>

    e il css:

    .rettangolo {
    background: #000;
    filter:alpha(opacity=70);
    -moz-opacity:.7;
    opacity:.7;
    }

    .immagine a:hover img{
    filter:alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
    }


    come faccio a slegare il l'opacità dell'immagine da quella della div "rettangolo"???
    • CommentAuthorNopox
    • CommentTimeJan 10th 2011
     permalink
    how do I untie the opacity of the image from that of the div "rectangle"??
    • CommentAuthorbappa06
    • CommentTimeJan 10th 2011
     permalink
    I have been banned cause I'm an idiot
    Hi, There

    I don't know what you want. But the answer of "I want to create a hover effect on the image that allows me to reduce the
    transparency on mouseover." is below

    CSS:---
    .rettangolo {
    }

    .immagine a img{
    opacity: 1;
    }

    .immagine a:hover img{
    opacity: .5;
    }

    HTML:---
    <div class="rettangolo">
    <div class="immagine">
    <a href="#"><img src="a.png"></a>
    </div>
    </div>

    OR-----
    <div class="immagine">
    <a href="#"><img src="a.png"></a>
    </div>

    both HTML code will work.

    Thx
    • CommentAuthorNopox
    • CommentTimeJan 11th 2011
     permalink
    I tried ... does not work .. the background. rectangle impossible to have a 100% opacity
Add your comments
    Username Password
  • Format comments as (Help)