Javascript fade in with jQuery or Javascript -

how can make javascript fadein this: http://www.bewerberfilm.com

the videos fadein left , right. textboxes above videos fade in different second settings. how can realize that? can show me or me? have no experience in js/jquery want learn language.

you can add listener scroll event this:

$(document).ready(function() {    var element = $('#myelement');      var running = false;      $(window).scroll(function() {      console.log(element.position());      if (element.position().top <= $(window).scrolltop() + $(window).innerheight() && !running) {        console.log("triggering animation");        running = true;        element.removeclass().addclass('fadeinleftbig animated').one('webkitanimationend mozanimationend msanimationend oanimationend animationend', function() {          $(this).removeclass();        });      }    });  });

#myelement {    height: 40px;    clear: both;    border: 1px solid black;  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <p>    adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>adsada    <br/>  </p>  <div id="myelement"></div>

here working fiddle, entire css big stackoverflow snippet: http://jsfiddle.net/df19qumg/