Design comparison
Solution retrospective
I was able to complete the challenge, and learnt how to get icon from an online source, and credit the site.
What challenges did you encounter, and how did you overcome them?I encountered some challenges while trying to implement the black hand cursor hover effect (note that I downloaded a black hand icon from Flaticon website). Despite several attempts to resolve the issue, I was unable to determine the cause. I plan to revisit and troubleshoot the problem when I have the opportunity.
As a result, I was unable to complete the challenge, specifically the part involving displaying a black cursor when hovering over elements that require interaction.
What specific areas of your project would you like help with?I would appreciate if someone could review my code and point out a fix for the issued I had with displaying my downloaded cursor icon as hover effect.
Community feedback
- @StroudyPosted 4 months ago
Great solution, I think i found the issue looking at your code,
color: var(--gray-800); cursor: url(up-sign.png), pointer; } cursor: url(assets/images/up-sign.png), pointer; You got to tell the command what folders to get the image from. Let me know if this work. You could try this aswell cursor: url(assets/images/up-sign.png) 4 12, auto;0 - @AffanRMPosted 4 months ago
Hey, your downloaded cursor image size is 512x512 pixels and most browsers have restrictions on the image size (should be less than or equal to 128x128 pixels). I tried downloading a 24x24 cursor image and then set it as the following and it works:
{cursor: url('<image_path>'), auto;If you need any further assistance, let me know!
0@KS-Coder24Posted 4 months ago@AffanRM , Thank you very much. I'll try that. Much Appreciated.
0
Please log in to post a comment
Log in with GitHub
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord