fade left to right in an animation

Looking for suggestions on doing a fade from left to right in an animation. I've attached my test xar. It works, but it isn't real smooth. Thanks.

yellobird, I have been fooling around with for quite awhile and what I did was changed all the frames from 2sec to 1sec and it seemed to help smooth it out the wierd part is sometimes it previewed OK and sometimes I got preview movie. I'm sure others here can figure it out better than I.


Attachment 129551Attachment 129553

Moved to Web Design chat.

My attempt attached.

This is another example where more control over time and fade would be a huge improvement.

Thank you, Gary.

Quite difficult to do this but here goes: https://initiostar.co.uk/demo/Reveal/#xl_xr_page_index

Different approach using a supersite with a crossfade between pages and animation code borrowed from the 'supersite slider' [Website HTML (body) and HTML (head) ]

Attachment 129555

I'd guess you could do this with code - have a static picture and an animated overlay where the opacity changes to reveal the picture from left to right (but I've not ventured there).

Quote:

---

I'd guess you could do this with code - have a static picture and an animated overlay where the opacity changes to reveal the picture from left to right (but I've not ventured there).

---

That's how I've done it Gary. I've placed a static image in Xara and overlaid it with a animated svg. It creates a far smoother animation plus a great file size saving.

@ Gary P yours is not the same animation Yellow Bird is after ;)

DEMO

Here's another example using the same technique:

DEMO2

As the Thread has been highjacked as the OP was asking about smooth Xara Animations and not web solutions using Supersites or SVG, my highjack is a CSS solution that is fairly generic.

Some transparent(-ish) blob is given a filename of mask(.png / .webp).
A Placeholder then animated this mask over a static other blob.

I made it repeat on a 10 second timer.
The mask can be set to move in any direction.

Attachment 129557

Acorn

ok, animator speaking here: I looked at your animation and the reason it is not smooth is that you have not synced the transparency gradient of your image with the timing of your frame sequence; the fact that xara will not allow you to create this on a timeline, or tweak the easing in/out of the frames, or tween/morph trransparency does not help

you could take a piece of paper and a pencil and work out the ideal ratio between gradient slope and timing interval and adjust your image and frame timing accordingly; but if this is for web, I guess the alternative solutions posed here from the webmasters would be better, easier and simpler

Thanks everyone. Attached is the video it is for - 2nd section(had to put it in real low quality to upload here).Attachment 129560 I have a lot of work to do on it yet.

Excellent yellowbird.

I agree ... Excellent. I thought that the quality was fine, and didn't notice it not being smooth.

I suppose it's what you finally do with it. For the web, it's probably quite fast and acceptable. For a screen presentation, it may be a little low quality, but I've seen far far worse presentations.