title: Stopping mightySlider grid view to position slides randomly
body: <p>I'm using grid view of mightySlider. It's working fine but I don't want my slides position to be set randomly.I want  a fix position of my slides.</p>
  
  <p>This is the code I'm using :</p>
  
  <pre><code>            function getViewport() {
              var e = window,
                  a = 'inner';
              if (!('innerWidth' in window)) {
                  a = 'client';
                  e = document.documentElement || document.body;
              }
              return {
                  width: e[a + 'Width'],
                  height: e[a + 'Height']
              }
          }
  
  
          jQuery(document).ready(function($) {
              var $win = $(window),
                  isTouch = !!('ontouchstart' in window),
                  clickEvent = isTouch ? 'tap' : 'click',
                  $gridsContainer = $('ul.items'),
                  $big = $('li.bigGrid', $gridsContainer),
                  $wide = $('li.wideGrid', $gridsContainer),
                  $large = $('li.largeGrid', $gridsContainer),
                  $small = $('li.smallGrid', $gridsContainer),
                  $frames = $('.frame', $gridsContainer),
                  sliders = $frames.length,
                  history = [],
                  wall = new freewall('ul.items');
  
              function resizeGrids(width) {
                  var bigWidth = $big.eq(0).outerWidth(),
                      wideWidth = $wide.eq(0).outerWidth(),
                      largeWidth = $large.eq(0).outerWidth(),
                      smallWidth = $small.eq(0).outerWidth();
  
                  if (width &lt;= 480) {
                      $big.height(bigWidth);
                      $small.height(smallWidth);
                      $wide.height(wideWidth);
                      $large.height(largeWidth);
                  }
                  else {
                      $big.height(bigWidth);
                      $small.height(smallWidth);
                      $wide.height(wideWidth / 2);
                      $large.height(largeWidth * 2);
                  }
  
                  wall.fitWidth();
              }
  
  
              wall.reset({
                  selector: 'li',
                  animate: 0,
                  cellW: 300,
                  cellH: 300,
                  fixSize: 0,
                  gutterY: 0,
                  gutterX: 0,
                  onResize: function () {
                      wall.fitWidth();
                  }
              });
  
  
              function countDown(sliderID) {
                  var time = 5000 + Math.floor(Math.random() * 10000);
  
                  history[sliderID] = clearTimeout(history[sliderID]);
  
                  history[sliderID] = setTimeout(function() {
                      var api = $frames.eq(sliderID).data('mightySlider');
  
                      if(api.relative.activeSlide === api.slides.length - 1)
                          api.activate(0);
                      else
                          api.next();
                  }, time);
              }
  
  
              // Resize the grids height to fix the aspect ratio
              resizeGrids(getViewport().width);
  
  
              $.fn.randomize = function(selector){
                  var $elems = selector ? $(this).find(selector) : $(this).children(),
                      $parents = $elems.parent();
  
                  $parents.each(function(){
                      $(this).children(selector).sort(function(){
                          return Math.round(Math.random()) - 0.5;
                      }).detach().appendTo(this);
                  });
  
                  return this;
              };
  
  
              $gridsContainer.randomize();
  
  
              $frames.mightySlider({
                  speed: 1000,
                  viewport: 'fill',
                  easing: 'easeOutExpo',
                  startRandom:  0,  
                  // Navigation options
                  navigation: {
                      slideSize: '100%'
                  },
  
                  // Dragging options
                  dragging: {
                      mouseDragging: 0,
                      touchDragging: 0
                  }
              }, {
                  active: function() {
                      var sliderID = $frames.index(this.frame);
                      countDown(sliderID);
                  }
              });
  
  
              $win.on('resize', function() {
                  // Resize the grids height to fix the aspect ratio
                  resizeGrids(getViewport().width);
              });
  
              setTimeout(function(){
                  $win.trigger('resize');
              }, 100);
          });
  </code></pre>
  
  <p>How Can I fix my slides positions??
  Thanks</p>