Ambiera Forum

Discussions, Help and Support.

Ambiera Forum > RocketCake
Fade-in at hover

feri
Registered User
Quote
2016-12-02 22:58:51

Can you show a way for a text underline or button border not just to appear quickly at hover, but to fade in and fade out? It looks really cool.


niko
Moderator
Quote
2016-12-04 07:19:37

I think you can do this with the CSS transition effect. I haven't tried it out, but it should work like this:
transition: opacity 2s ease-in;



feri
Registered User
Quote
2016-12-08 09:29:17

Thanks Niko, for the answer.
I played around, and the following is working for me:
With Text I could not make a transition, only with a Styled Button. The text still changes immediately.
The Styled Button must UseHoverStyles.
Then right click on the button, and choose HTML code...
At Additional attributes choose: Additional CSS styles
At the space under write: transition: 1.5s;
1.5s is of course the time of the transition.
That's it. The Text still changes immediately, but the background and the border changes slowly.
If I want only an underline, then I set the background to transparent, background mode: define for all 4 sides, choose BorderModeBottom: Solid.
This way I only have an uderline, and it changes it's color slowly.
I love it. I've changed all of my websites.


niko
Moderator
Quote
2016-12-09 06:43:33

Cool! Thanks for posting.


Create reply:


Posted by: (you are not logged in)


Enter the missing letter in: "Inter?ational" (you are not logged in)


Text:

 

  

Possible Codes


Feature Code
Link [url] www.example.com [/url]
Bold [b]bold text[/b]
Image [img]http://www.example.com/image.jpg[/img]
Quote [quote]quoted text[/quote]
Code [code]source code[/code]

Emoticons


   






Copyright© Ambiera e.U. all rights reserved.
Privacy Policy | Terms and Conditions | Imprint | Contact