Another option, which avoids having to add anything to your model, would be
```
crossFadeTextTo text =
Animation.interrupt
[ Animation.to [Animation.opacity 0]
, Animation.send (DoneFadingOutOldTextPleaseSwitchModelToNewText text)
, Animation.to [Animation.opacity 1]
]
```
On Friday, 30 September 2016 21:01:37 UTC+2, Matthew Griffith wrote:
>
>
> That's a pretty reasonable way to do it. Another option could be could be
> to use one div and use `Animation.send`. Basically you could do something
> like this.
>
>
> ```
> Animation.interrupt
> [ Animation.to [Animation.opacity 0]
> , Animation.send DoneFadingOutOldTextPleaseSwitchModelToNewText
> , Animation.to [Animation.opacity 1]
> ]
> ```
>
> In this case you'd have to keep new text in a 'staging area' in your model
> and then switch it in when DoneFadingOutOldTextPleaseSwitchModelToNewText
> fires.
>
>
> On Friday, September 30, 2016 at 2:30:53 PM UTC-4, Rex van der Spuy wrote:
>>
>> Hi Everyone!
>>
>> Just a quick question: Can anyone suggest a simple way to fade out some
>> old text and fade in some new text when a `model.text` value changes?
>>
>> I did this once a few apps ago where I created 2 `div` layers:
>> `currentText` and `previousText`
>> Then, when the text value changed, I moved the text to the previousText
>> layer and faded it out, and then displayed the updated text on the
>> currentText layer and faded it in.
>> (I used `elm-html-animation` for the fade effect.)
>>
>> Does this seem reasonable or is there a better, easier way?
>>
>
--
You received this message because you are subscribed to the Google Groups "Elm
Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
For more options, visit https://groups.google.com/d/optout.
