CODEWITHSUNDEEP
jqueryslice
maskedjellybean
maskedjellybean

Reputation: 719

jQuery .Slice clarification

Could someone please explain to me the supposed purpose of .Slice in this piece of code? How can you select a subset of padding-bottom? Thanks a lot.

$(this).bind('click', function(){
      var tid = $(this).attr('id');
      tid = tid.replace('play-button-', '');
      playheight = parseInt($('#play-view-' + tid, 10).height());
      playpadding = parseInt($('#play-view-' + tid, 10).css('padding-bottom').slice(0, -2));
      var flex_height = playheight + playpadding;
      setTimeout(function(){
        $('.flex-viewport').animate({height: flex_height});
      },200);
    });

--- Alternative without using slice ----

    $(this).bind('click', function(){
      var tid = $(this).attr('id');
      tid = tid.replace('playlist-button-', '');
      playheight = $('#playlist-display-' + tid).height();
      playheight = parseInt(playheight, 10);
      playpadding = ('#playlist-display-' + tid);
      playpadding = $(playpadding).css('padding-bottom');
      if (playpadding != null) {
        playpadding = parseInt(playpadding, 10);
        flex_height = playheight + playpadding;
      } else {
        flex_height = playheight;
      }
        setTimeout(function(){
        $('.flex-viewport').animate({height: flex_height});
      },200);
    });

Upvotes: 0

Views: 156

Answers (1)

becquerel
becquerel

Reputation: 1131

Slice on a string takes a substring and returns it.

In this case it gets the padding value and removes the last two characters (the units - for example px or em) so the ParseInt can parse the string as an integer.

'10px'.slice(0,-2) will return '10'

You can check this answer for some differences from the substring function:

Upvotes: 1

Related Questions