Experimental replacement for Xara Hover 3

[Acorn]

This mostly works. Happy for others to contribute...

As in the Xara Hover Widget Successor, I have use the z-index to bring the text to the top so the Link is not covered up.

CSS - Hover Widget 3 Successor.xar

I don't like the concept much but I suppose you could use it for a fancy NavBar reveal.

Acorn

[Egg Bramhill]

It has a very unpleasant juddery effect Acorn.

[Acorn]

It has a very unpleasant juddery effect Acorn.

Hence experimental Egg.

I have been trying to avoid complexity by not using JavaScript while fighting within Xara's constraints.

I am not claiming these are definitive, just hoping to bounce ideas around.
And tweak Xara.

Acorn

[Egg Bramhill]

Not a complaint, just an observation Acorn. I'm in no position to better your css.

... just hoping to bounce ideas around.

Certainly bouncing.

[Acorn]

Not a complaint, just an observation Acorn. I'm in no position to better your css.
Certainly bouncing.

Egg, I appreciate it is a precarious position for you to be in, considering your ancestor's plight on the wall incident.

Acorns are tougher nuts to crack, facing all the elements, day and night.

If you replace the CSS Code (transition: 1200ms with transition: 1200ms ease; OR transition: 1200ms ease-in-out;, the jitters are greatly reduced.
A modified ease-in-out of transition: 1200ms cubic-bezier(0.8,0,0.58,1); seems to work the best.

Acorn

[Egg Bramhill]

Egg, I appreciate it is a precarious position for you to be in, considering your ancestor's plight on the wall incident.

Acorn, it could be either my name you're refering to or my close location to the original Humpty-Dumpty which was a canon on the walls of Colchester (not far up the road from me) which was toppled off the wall in the civil war 1648.