Question

143

How do I fade in and out a hidden element using Mootools

rated 0 times [ 146] [ 3] / answers: 1 / hits: 20149 / 15 Years ago, tue, september 1, 2009, 12:00:00

I am trying to fade in a hidden element, and then fade it back out again using mootools.

I can't just use $('my_div').fade('toggle'), because that assumes the element is always visible, whereas my div starts out with display:none.

Is there a simple way to combine a fade in/out with a slide in/out or some other way to achieve a nice effect?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

clarkulisesa

Add To Favorites

Follow

Total Points: 422

Total Questions: 93

Total Answers: 112

Location: Austria

Member since Thu, Jan 7, 2021

3 Years ago

clarkulisesa questions

1 Google BigQuery Error: Syntax error: Illegal input character %

Fri, Sep 18, 20, 00:00, 4 Years ago

1 how to change state of a react component from another component

Mon, Jun 22, 20, 00:00, 4 Years ago

1 How to compare objects using lodash regardless on their order

Tue, Jun 16, 20, 00:00, 4 Years ago

1 How to listen sortChange(event) on Angular for ag-Grid?

Mon, Feb 24, 20, 00:00, 4 Years ago

1 Vue JS provide/inject and Props

Mon, Aug 12, 19, 00:00, 5 Years ago

View All

answered 15 Years ago paola · Accepted Answer

I almost always use Fx.Reveal in Mootools.More:

http://mootools.net/docs/more/Fx/Fx.Reveal

Very nice fade-in animation, almost no effort on your part. Fx.Slide might also do the trick, although it tends to be more fiddly.

If you don't want to use Mootools.More, then rolling your own solution with Fx.Morph to change both height and opacity simultaneously could also do the trick.