Thumbnail Hover

[Naomi87]

Hi lieve mensen ik zit hier dus met een klein probleempje
ik heb dus op mijn html pagina stuk of 10 thumbnail links en die wil ik graag met css hover effect geven met een play knop, opzich hij werkt wel alleen hij komt achter de thumbnails te staan dus die zie je nauwelijks, enig idee hoe ik dit voor elkaar krijg?
bij voorbaat hartstikke bedankt

 

[Goeroeboeroe]

Dat zou moeten kunnen, maar dan moet je wel 'n link naar je site geven, zodat we de code kunnen bekijken, of je code hier neerzetten. Want 't is zo wat lastig 't probleem te vinden...

 

[Naomi87]

ik heb hem nu wel aan de werk gekregen door iemands hulp en die ziet er zo uit

html: <img class="thumb" src="image/image3.jpg" alt="image" />

css: .
img.thumb
{
border: 1px solid #CCC;
position: relative;
z-index: -1;
}
a
{
z-index: 1;
width: 160px; /* de width veranderen in de voor jou juiste */
height: 100px; /* dit ook voor de height doen */
display: block;
}
a:hover
{
background-image: url('button.png');
background-repeat: no-repeat;
background-position: center center;
}

nu heb ik probleem met de a, en de a:hover
ik heb dit namelijk ook in mijn css zitten voor mij links..
ik heb bijvoorbeeld img.thumb a, img.thumb a:hover geprobeerd maar dan werkt mijn hover niet meer enige oplossing?

 

[tiran818]

als het goed is kan je de code veranderen door

css: .
img.thumb
{
border: 1px solid #CCC;
position: relative;
z-index: -1;
}
a.img
{
z-index: 1;
width: 160px; /* de width veranderen in de voor jou juiste */
height: 100px; /* dit ook voor de height doen */
display: block;
}
a.img:hover
{
background-image: url('button.png');
background-repeat: no-repeat;
background-position: center center;
}

dan even bij de links voor de afbeeldingen toevoegen class="img"
voorzover ik weet moet dit werken