Skip to content
OverviewSolutions
5
Comments
1
Zhemchuzhnyi Andrii
@n3kk3ll

All comments

  • Keshav Tulsyan•170
    @codekeshSubmitted over 2 years ago

    I am facing issue opacity of icon while hovering. Please give me advice to fixed this. All feedback are welcome. Thank You

    NFT Preview Card Component

    2
    Zhemchuzhnyi Andrii•50
    @n3kk3llPosted over 2 years ago

    Hi Keshav

    Answering to your question, you can check the way I did it on my solution. Anyway:

    • You have to set position property as absolute (don't forgive to set position: relative to its parent) and hide div that is sibling to image:
    .equil .overlay {
    position: absolute;
    top: 0;
    left: 0;
    visibility: hidden;
    opacity: 0;
}
    • And show this block by hover at image:
    .equil img:hover .overlay {
visibility: visible;
opacity: 1;
}
    • The rest you have to do is to style appearing <div class="overlay"></div> block. Be creative!

    If you'd have some problems with that solution, you're welcome to ask more. Hope I helped you!

    Good luck with that! Keep it going!

    0