Milan Poznan
Milan Poznan

Reputation: 305

Can't understand function Javascript

Hello everyone I am frontend beginner, so for me parallax scrolling is very interesting area, and now I start learning it. I am watching tutorials and read a lot of stuff for it, but still I am filing as a beginner. And now I have this:

if (wScroll > $('.clothes-pics').offset().top - ($(window).height() / 1.2)) { 

$('.clothes-pics figure').each(function(i){

setTimeout(function(){ 

  $('.clothes-pics figure').eq(i).addClass('is-showing'); 
  }, (300 * (Math.exp(i * 0.15))) - 700); 
  }); 

}

So here in this example i don't understand the (300 * (Math.exp(i * 0.15))) - 700); code before it I can understand 85%, but here i don't know what is what, and I am really confused. If anyone can explain it to me i will be very thankful.
And If someone know some good tutorial for parallax it will be very welcome.

Upvotes: 0

Views: 73

Answers (2)

Nick Bull
Nick Bull

Reputation: 9876

It's the timeOut value for the setTimeout(callback, timeout) function.

The Math.exp(i * 0.15) means that, depending on the index, an exponent of i*0.15, which is the same as e^(i * 0.15), where i is the value and e is Euler's number.

Interesting way of calculating the timeOut. Here's a list of values for (i) => { return (300 * (Math.exp(i * 0.15))) - 700); } to give you an idea of what a larger index value means for that timeOut:

1        =>        -351.449727182
2        =>        -295.042357727
3        =>        -229.506344353
10       =>         644.506721101
100      =>         980704511.742
1,000    =>         4.1811287*(10^67)

A very strange way to wait a (sometimes negative) quantity of time before adding a class based on element index, basically.

Upvotes: 2

RPaul
RPaul

Reputation: 66

The calculation part belongs to setTimeout(function(){.

All it does is calculate the milliseconds the system will wait before executing this line:

$('.clothes-pics figure').eq(i).addClass('is-showing');

Sauce

Simply follow the brackets and you'll see that (300 * (Math.exp(i * 0.15))) - 700); is a parameter for the setTimeout function, all you'll have to do now is google the function and see what that parameter does. Hope this helps :)

Upvotes: 0

Related Questions