Welcome to TalkGraphics.com
Page 1 of 2 12 LastLast
Results 1 to 10 of 12
  1. #1

    Default 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.
    Attached Files Attached Files

  2. #2
    Join Date
    Oct 2006
    Location
    StPeters, MO USA
    Posts
    10,078

    Default Re: fade left to right in an animation

    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 129551fade left to right animation 2.xar
    Larry a.k.a wizard509

    Never give up. You will never fail, but you may find a lot of ways that don't work.

  3. #3
    Join Date
    Aug 2000
    Location
    Placitas, New Mexico, USA
    Posts
    39,240

    Default Re: fade left to right in an animation

    Moved to Web Design chat.

    My attempt attached.

    This is another example where more control over time and fade would be a huge improvement.
    Attached Files Attached Files
    Gary W. Priester
    Mr. Moderator Emeritus Dude
    , Sir

    gwpriester.com | Custom-Stereograms.com | eyeTricks on Facebook






  4. #4
    Join Date
    Oct 2006
    Location
    StPeters, MO USA
    Posts
    10,078

    Default Re: fade left to right in an animation

    Thank you, Gary.
    Larry a.k.a wizard509

    Never give up. You will never fail, but you may find a lot of ways that don't work.

  5. #5
    Join Date
    Apr 2018
    Location
    London
    Posts
    563

    Default Re: fade left to right in an animation

    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) ]

    Left Animation.xar

    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).

  6. #6
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    20,461

    Default Re: fade left to right in an animation

    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
    Last edited by Egg Bramhill; 02 May 2021 at 12:00 AM.
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  7. #7
    Join Date
    Aug 2000
    Location
    Harwich, Essex, England
    Posts
    20,461

    Default Re: fade left to right in an animation

    Here's another example using the same technique:

    DEMO2
    Egg

    Intel i7 - 4790K Quad Core + 16 GB Ram + NVIDIA Geforce GTX 1660 Graphics Card + MSI Optix Mag321 Curv monitor
    + Samsung 970 EVO Plus 500GB SSD + 232 GB SSD + 250 GB SSD portable drive + ISP = BT + Web Hosting = TSO Host

  8. #8
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    13,266

    Info Re: fade left to right in an animation

    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.

    CSS - Sliding Mask.xar

    Acorn
    Acorn - installed and active Xara software: Cloud+/Pro+, XDPX, XWD Premium 15 & 12, XPGD10, X3D7, Xara Xtreme 5, back through time (to CC's Artworks).
    Raise software faults with MagiXara: http://support.magix.net/; if Cloud+/Pro+: https://xara.com/contact-us/

  9. #9
    Join Date
    Feb 2007
    Location
    UK
    Posts
    18,761

    Default Re: fade left to right in an animation

    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
    -------------------------------
    what can I say ?

  10. #10

    Default Re: fade left to right in an animation

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

 

 

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •