Hover avatar inhoud

Vorige onderwerp Volgende onderwerp Ga naar beneden

Opgeloste Topic Hover avatar inhoud

Bericht van NiboriUkitake op zo 6 maa 2016 - 12:09

Hallo,

Op ons forum zijn wij bezig met een hover avatar en alles lukt, enkel hebben wij het probleem dat ook de tekst en het vakje dat erin staat ook doorzichtig wordt. Dit is natuurlijk niet de bedoeling, maar we vinden niet hoe we het kunnen verhelpen.

Zo ziet het eruit:
https://gyazo.com/a53ed3033d7ebdcb533508145160f58a
Zoals je ziet in de inhoud van de hover ook doorzichtig, hoe kunnen we dit verhelpen?

Alvast bedankt ^^
avatar

NiboriUkitake
Forumlid

Vrouw Aantal berichten : 56
Geboortedatum : 09-09-97
Leeftijd : 20
Registratiedatum : 22-06-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja

Profiel bekijken http://supernaturall.actieforum.com/
NiboriUkitake is bedankt door de starter van dit topic.

Opgeloste Topic Re: Hover avatar inhoud

Bericht van 10spetter10 op zo 6 maa 2016 - 17:02

Hoi,

Ik vermoed dat je een van je parent elementen een doorzichtigheid hebt meegegeven. Hierdoor zijn alle hoger liggende elementen ook doorzichtig. Als je enkel een achtergrondkleur doorzichtig wilt hebben kan je beter rgba gebruiken in de plaats van hex/rgb/hsl. Als je een doorzichtige achtergrondfoto wilt zou je deze beter met css in een 'before' element steken.

Ik kan gerichtere info geven als ik het voorbeeld kan bekijken op je forum zelf zodat ik de html kan zien. Als je de url liever privé houdt mag je me die sturen in pm.
avatar

10spetter10
Medaille Forumlid

Man Aantal berichten : 1303
Geboortedatum : 21-04-97
Leeftijd : 21
Taal : Nederlands
Locatie : België
Registratiedatum : 08-07-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja

Profiel bekijken
10spetter10 is bedankt door de starter van dit topic.

Opgeloste Topic Re: Hover avatar inhoud

Bericht van Blackraven op zo 6 maa 2016 - 17:37

ik werk samen aan hetzelfde forum^^
hier is de link http://letskilltonight.actieforum.com/

En hier zijn de code:
Spoiler:
Code:
.b {}
.c {height: 400px; width: 250px; position: relative; z-index: 0;}
.c:hover .d {opacity: 0.5;}
.d {opacity: 0; height: 400px; width: 250px; position: relative; z-index: 99; top: -400px; background-color: #1a1a1a;
-webkit-transition: opacity 0.7s ease-in; -moz-transition: opacity 0.5s ease-in; -o-transition: opacity 1s ease-in;
-ms-transition: opacity 1s ease-in; transition: opacity 1s ease-in;}
#hoverblock:hover {opacity: 1;}
#words {opacity: 15;}

wil je ook de template code?
avatar

Blackraven
Actief Forumlid

Vrouw Aantal berichten : 102
Geboortedatum : 23-05-95
Leeftijd : 23
Taal : Nederlands
Locatie : Thuis
Registratiedatum : 10-04-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja

Profiel bekijken http://untildawn.actieforum.com/
Blackraven is bedankt door de starter van dit topic.

Opgeloste Topic Re: Hover avatar inhoud

Bericht van 10spetter10 op zo 6 maa 2016 - 18:32

De template heb ik normaal gezien niet nodig.

Je kan eens proberen of het goed is als je deze css gebruikt:

Code:
.b {}
.c {height: 400px; width: 250px; position: relative; z-index: 0;}
.c:hover .d {opacity: 1;}
.d {opacity: 0; height: 400px; width: 250px; position: relative; z-index: 99; top: -400px; background-color: rgba(26, 26, 26, 0.5);
-webkit-transition: opacity 0.7s ease-in; -moz-transition: opacity 0.5s ease-in; -o-transition: opacity 1s ease-in;
-ms-transition: opacity 1s ease-in; transition: opacity 1s ease-in;}
#hoverblock:hover {opacity: 1;}
#words {opacity: 15;}
avatar

10spetter10
Medaille Forumlid

Man Aantal berichten : 1303
Geboortedatum : 21-04-97
Leeftijd : 21
Taal : Nederlands
Locatie : België
Registratiedatum : 08-07-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja

Profiel bekijken
10spetter10 is bedankt door de starter van dit topic.

Opgeloste Topic Re: Hover avatar inhoud

Bericht van Blackraven op zo 6 maa 2016 - 18:36

Yep dat werkte helemaal!
Thanks voor de snelle reactie!
avatar

Blackraven
Actief Forumlid

Vrouw Aantal berichten : 102
Geboortedatum : 23-05-95
Leeftijd : 23
Taal : Nederlands
Locatie : Thuis
Registratiedatum : 10-04-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja

Profiel bekijken http://untildawn.actieforum.com/
Blackraven is bedankt door de starter van dit topic.

Opgeloste Topic Re: Hover avatar inhoud

Bericht van 10spetter10 op zo 6 maa 2016 - 19:07

..Ondersteunings Vraag opgelost en gesloten.
avatar

10spetter10
Medaille Forumlid

Man Aantal berichten : 1303
Geboortedatum : 21-04-97
Leeftijd : 21
Taal : Nederlands
Locatie : België
Registratiedatum : 08-07-12
Oprichter van het forum : Ja
Templates gewijzigd : Ja
CSS : Ja

Profiel bekijken
10spetter10 is bedankt door de starter van dit topic.

Vorige onderwerp Volgende onderwerp Terug naar boven


Permissies van dit forum:
Je mag geen reacties plaatsen in dit subforum