Skip to content

Instantly share code, notes, and snippets.

@NathanQ

NathanQ/bootstrap_helpers.js

Last active November 10, 2017 23:34
Show Gist options
  • Save NathanQ/f102620ebb92ebe36a33f8730b00fb49 to your computer and use it in GitHub Desktop.
Save NathanQ/f102620ebb92ebe36a33f8730b00fb49 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. NathanQ revised this gist Nov 10, 2017. 1 changed file with 5 additions and 5 deletions.
    10 changes: 5 additions & 5 deletions bootstrap_helpers.js
    View file
    Original file line number Diff line number Diff line change
    @@ -10,20 +10,20 @@ $(function() {
    });

    // make things in a group the same height
    function sameHeightenator(groupToSameHeight, sameHeighters) {
    function sameHeightenate(groupToSameHeight, sameHeighters) {
    $(groupToSameHeight).each(function() {
    var tallest = 0;
    $(sameHeighters).each(function() {
    $(sameHeighters, $(groupToSameHeight)).each(function() {
    tallest = tallest > $(this).height() ? tallest: $(this).height();
    });
    $(sameHeighters).each(function() {
    $(sameHeighters, $(groupToSameHeight)).each(function() {
    $(this).height(tallest);
    });
    });
    }

    $(function() {
    // example
    sameHeightenator('.card-group.row', '.card');
    sameHeightenator('.carousel.row', '.carousel-item');
    sameHeightenate('.card-group.row', '.card');
    sameHeightenate('.carousel.row', '.carousel-item');
    });
  2. NathanQ revised this gist Nov 10, 2017. 1 changed file with 3 additions and 3 deletions.
    6 changes: 3 additions & 3 deletions bootstrap_helpers.js
    View file
    Original file line number Diff line number Diff line change
    @@ -10,7 +10,7 @@ $(function() {
    });

    // make things in a group the same height
    function sameHeightenate(groupToSameHeight, sameHeighters) {
    function sameHeightenator(groupToSameHeight, sameHeighters) {
    $(groupToSameHeight).each(function() {
    var tallest = 0;
    $(sameHeighters).each(function() {
    @@ -24,6 +24,6 @@ function sameHeightenate(groupToSameHeight, sameHeighters) {

    $(function() {
    // example
    sameHeightenate('.card-group.row', '.card');
    sameHeightenate('.carousel.row', '.carousel-item');
    sameHeightenator('.card-group.row', '.card');
    sameHeightenator('.carousel.row', '.carousel-item');
    });
  3. NathanQ revised this gist Nov 10, 2017. 1 changed file with 15 additions and 22 deletions.
    37 changes: 15 additions & 22 deletions bootstrap_helpers.js
    View file
    Original file line number Diff line number Diff line change
    @@ -9,28 +9,21 @@ $(function() {
    });
    });

    // make all bootstrap tabs the same height independent of their content so they look regular.
    $(function() {
    var tallestTab = 0;

    $('.nav-tabs a').each(function() {
    tallestTab = tallestTab > $(this).height() ? tallestTab: $(this).height();
    });

    $('.nav-tabs a').each(function() {
    $(this).height(tallestTab);
    });
    });
    // make things in a group the same height
    function sameHeightenate(groupToSameHeight, sameHeighters) {
    $(groupToSameHeight).each(function() {
    var tallest = 0;
    $(sameHeighters).each(function() {
    tallest = tallest > $(this).height() ? tallest: $(this).height();
    });
    $(sameHeighters).each(function() {
    $(this).height(tallest);
    });
    });
    }

    // make all bootstrap carousel items the same height so there's no jumpiness on carousel transitions
    $(function() {
    var tallestCarouselItem = 0;

    $('.carousel .item').each(function() {
    tallestCarouselItem = tallestCarouselItem > $(this).height() ? tallestCarouselItem: $(this).height();
    });

    $('.carousel .item').each(function() {
    $(this).height(tallestCarouselItem);
    });
    // example
    sameHeightenate('.card-group.row', '.card');
    sameHeightenate('.carousel.row', '.carousel-item');
    });
  4. NathanQ created this gist Sep 12, 2017.
    36 changes: 36 additions & 0 deletions bootstrap_helpers.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,36 @@
    // scroll to heading of open collapse item so content is presented on the screen
    $(function() {
    $('.panel-collapse').on('shown.bs.collapse', function (e) {
    var $panel = $(this).closest('.panel');

    $('html,body').animate({
    scrollTop: $panel.offset().top
    }, 250);
    });
    });

    // make all bootstrap tabs the same height independent of their content so they look regular.
    $(function() {
    var tallestTab = 0;

    $('.nav-tabs a').each(function() {
    tallestTab = tallestTab > $(this).height() ? tallestTab: $(this).height();
    });

    $('.nav-tabs a').each(function() {
    $(this).height(tallestTab);
    });
    });

    // make all bootstrap carousel items the same height so there's no jumpiness on carousel transitions
    $(function() {
    var tallestCarouselItem = 0;

    $('.carousel .item').each(function() {
    tallestCarouselItem = tallestCarouselItem > $(this).height() ? tallestCarouselItem: $(this).height();
    });

    $('.carousel .item').each(function() {
    $(this).height(tallestCarouselItem);
    });
    });