Mouse hover effect italic
-
Perfect! It is working :) Love that effect!
-
Hey,
The probleme with the code above is, that the software just shifting the letters to the side, which makes the letters look weird. Fonts normally have specific italics which are drawn manually individually.So in this case, I just want to change a font to another font when hovering. I have a specific Webfont uploaded when hovering above text.
What's the CSS Code for that?Best
Wynz -
i think its best if you use a font that is a "variable font"
one of the axis of the font should be italics, and then you just need to find the css that changes that axis, and then change that on hover
for example here: https://v-fonts.com/
there is a font:
it has the italics axis. this value can have different values and is set via css, thus it can be changed on .yourselector:hover {}
-
Variable it no option at the moment. But isn't it possible to change a font easily when hovering over another one?
Like changing a font from HELVETICA to TIMES NEW ROMAN when hovering above it (extreme example) …I feel like the code above is really simple and something similar will work, but I have no clue what the code will look like.
Something like:
a:hover {
font: Times New Roman;
} -
yea you can just change the font family on hover, sure
but it won't give you a transition animation
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