Hi. I want to change color of text on hover. Custom class gives hard on/off effect.
Is there an option to get more like transition effect from one color to another ?
Blocs Class Manager doesn’t support this attribute just yet, but you can add it by adding a style to the page header.
Eg.
.myClass a {
transition:color 1s ease-in-out;
}The 1s is length of time. You can change it, 0.3s or 0.7s etc.
1 Like
Solution looks great but it doesn’t work for me right know. Still goes without transition.
I’ve added code through window --> code editor --> page header section --> paste code.
Next I’ve created custom class for H1. Normal mode has gray color, hover has white color.
I’ve also tried to add it doesn’t help.
Hey @piotrek
It would look like this for just h1 text (no links).
<style>
h1 {
color: #333;
transition:color 0.5s ease-in-out;
}
h1:hover {
color: #fff;
}
</style>If you already have them styled in the Class manager just add the transition attribute.
<style>
h1 {
transition:color 0.5s ease-in-out;
}
</style>
1 Like
if you want links just add “a”
<style>
h1 a {
transition:color 0.5s ease-in-out;
}
</style>It looks so easy. Thanks man!
1 Like