Css to div appear from top to bottom [closed]

-1

I once saw an effect on a site that I can not remember where else.

A div appeared gradually from the top to the bottom of it. Very nice.

It works like this: you scroll the page and when you get to that div, then it slowly pops up from the top to the bottom.

How to implement this css?

I have seen some effects on the net but nothing like what I saw

    
asked by anonymous 21.04.2016 / 18:21

1 answer

0

This is the effect you are looking for:

$("#test")
  .css('opacity', 0)
  .slideDown(1500)
  .animate(
{ opacity: 1 },
{ queue: false, duration: 1500 }
  );
#test {
				padding: 20px;
				background-color: green;
				color: white;
			}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divid="test" style="display:none;">
			Teste!
		</div>

EDIT: Added the "fadeIn" effect!

    
21.04.2016 / 21:52