Mouse over icon on links
-
Hi Armin,
is it there an option to change/customize the mouse over icon on links?
thanks.
-
arminunruh Global Moderatorwrote on Feb 14, 2017, 11:58 AM last edited by arminunruh Feb 14, 2017, 6:58 AM
Hey chris!
You can use this CSS for example:
a{ cursor: crosshair; }
You can put this css in "lay options" -> "custom html & css" -> "Custom CSS for Desktop Version"
Here is a list of standard cursors you can use:
https://developer.mozilla.org/en/docs/Web/CSS/cursor -
Thanks a lot Armin. But I want to use a image.
A gif or png. Do you know how does that works?thanks.
-
I put this CCS inside
.custom {
cursor: url(UntitledImage.png), auto;
}but it doesn´t works.
-
Finally. I got it.
a {
cursor: url(ImageLink.png), move;
}png not bigger than 64px in width.
-
Now I have a further question.
I want to use a custom cursor with image for all links except for the main menu.
How can I do that?Thanks.
-
Is it possible to let change the image for cursor on the right and on the left of the page?
If the cursor is more on the right area, I have a right direction arrow for example. Is the cursor more on the left area, I have a left direction arrow … -
arminunruh Global Moderatorreplied to colorvox on Feb 17, 2017, 12:33 PM last edited by arminunruh Feb 17, 2017, 7:34 AM
Hey!
You could use this extra css to have a normal cursor for the menu:
nav.primary a{ cursor: pointer; }
Having a left/right cursor on the left screen or the right screen only on links:
Yes this is possible but only with custom javascript and custom css. This is a bit more complex to do.You would need to listen to the mousemove javascript event and calculate which side you are on. Then you would need to add a html class to a link and remove it based on mouseenter and mouseleave js event listeners. also you would need to write some css for these html classes, one class for having a left cursor, another for having a right cursor.
I hope you can understand that this is a lot of custom code and maybe you can figure it out by yourself or find a programmer who can help you.
-
ok. thanks armin.
: )
3/9
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it