Moskva Yigit Moskva Yigit - 1 year ago 68
jQuery Question

jQuery i, i++ function

Just need some code that allows me to create auto function such as this :

$('ul.navigation li:first-child').attr('data-wow-duration','0.1s');
$('ul.navigation li:nth-child(2)').attr('data-wow-duration','0.3s');
$('ul.navigation li:first-child').attr('data-wow-delay','0s');
$('ul.navigation li:nth-child(2)').attr('data-wow-delay','0.1s');

The third child duration should be 0.5s, and the delay should be 0.2s
I can basically copy/paste the codes but it should depend on the navigation menu the amount of "li" exists.

Any quick solution for that?

Answer Source

You can use jQuery's each to not need to depend on the size, and you have access to the current index:

$('ul.navigation li').each(function(index) {
  $(this).attr('data-wow-duration', 0.1 + (0.2 * index) + 's');
  $(this).attr('data-wow-delay', (0.1 * index) + 's');