custom CSS werkt niet, Hover image

  • Opgelost rvsdesign

    (@rvsdesign)


    2 jaren, 10 maanden geleden

    Hallo,

    Ik ben bezig met mijn portfolio website waarbij ik een text/beschrijving wil laten verschijnen wanneer er gehoverd word over een gallerij rechts van de text. Met behulp van een tutorial (https://www.youtube.com/watch?v=ro8S69VE7Bk) heb ik een custom css code toegepast alleen krijg ik het niet werkend. In elementor heb ik het text object de ’txt1′ class gegeven en de gallerij ‘img1’

    De onderstaande custom css heb ik toegevoed binnen de theme customizer. Ik heb alle plugins uitgeschakeld en het ook geprobeerd in een ander theme maar kom er niet uit. Ik hoop dat iemand mij kan helpen. 

    .txt1{
    opacity:0;
    transition: all 0.8s ease-in-out; 
}

.img1:hover + .txt1{
    opacity:1;
}

    De pagina waar ik hulp bij nodig heb: [log in om de link te zien]

2 reacties aan het bekijken - 1 tot 2 (van in totaal 2)
  • Moderator Jeroen Rotty

    (@jeroenrotty)

    Support Moderator

    2 jaren, 10 maanden geleden

    Die code is bizar, je doet nl. een + en dat is nogal raar – de + zou willen zeggen alle txt1 elementen die net volgen na de img1, maar die structuur heb je niet op de pagina.

    Je selector moet dus wel kloppen. Als je binnen txt1 een img1 klasse hebt, dan zou dat bv.

    .txt1{
    opacity:0;
    transition: all 0.8s ease-in-out; 
}

.txt1 .img1{
    opacity:1;
}

    Moeten zijn, maar de structuur van je elementen moeten kloppen om je CSS er te doen op gelden. Kijk dus goed wat je structuur is in de DOM.

    Thread starter rvsdesign

    (@rvsdesign)

    2 jaren, 10 maanden geleden

    Dankje dat was de tip die ik nodig had. Het is opgelost.

2 reacties aan het bekijken - 1 tot 2 (van in totaal 2)
  • Het onderwerp ‘custom CSS werkt niet, Hover image’ is gesloten voor nieuwe reacties.

Tags