syamnath
8/19/2016 - 6:43 AM

Stretch the container to the width of the window in mobiles

Stretch the container to the width of the window in mobiles

/*Strechng the columns in mobile devices
****************************************/
$.fn.strechContainer = function () {
  /*Adding scope $(this) else the scope will be into $window*/ 
  var $this = $(this);
  /*Initialize the streching on window load and resize*/
  $(window).on("load resize", function () {
      if ($(window).width() < 992) {
        /*Checking if the width is less than 992px that is medium breakpoint*/
        $this.css({
          /*Add corresponding css values to the selector and also add the with to the selector*/
          'width': $(window).width() + 'px',
          'position': 'relative',
          'margin': '0',
          'left': '-20px'
          });
      } else {
        $this.css({
          /*Add corresponding css values to the selector and also add the with to the selector*/
          'width': '100%',
          'position': 'static',
          'margin-left': '0',
          'margin-right': '0',
          'left': 'inherit'
        });
      }
    });
};
$(".paragraph--type--page-testimonial").strechContainer();
$("#block-booknavigation").strechContainer();