I'm looking for a solution to change the cursor to a magnifying glass upon hovering over a Fancybox image.
Like on Pinterest, when you hover an image (using chrome).
So far I have this which doesn't have cross-browser support.
.picture img {
cursor:url(/img/layout/backgrounds/moz-zoom.gif), -moz-zoom-in;
}
Is there a better way to approach this problem?
For that you need to use a cursor file .cur
and not a file, so it will be like.gif
.picture img {
cursor: url(/img/layout/backgrounds/zoom.cur), -moz-zoom-in;
}
The above is when you wish to use a custom cursor using .cur
file. If you are ok with the default cursor provided by the browsers, you could simply use the below.
cursor: zoom-in;