禁用随机幻灯片顺序

时间:2019-04-01 16:01:51

标签: javascript twitter-bootstrap carousel

在没有Web开发人员的情况下扑朔迷离,需要快速解决方案。我不熟悉Javascript,但是有前端经验。我的目标是禁用分配给轮播的随机函数。

预先感谢您的帮助。

$(document).ready(function(){
  var $item = $('.carousel .item');
  var $wHeight = $(window).height();



  //the height of each slide becomes the height of the screen
  //ie the images are now full screen
  $item.height($wHeight); 
  $item.addClass('full-screen');

  //number of slides become the amount of items that have the class item
  var $numberofSlides = $('.item').length;
  var $currentSlide = Math.floor((Math.random() * $numberofSlides));
  //randomizes the current slide.

  //Bootstrap version of clicking on the circle to direct to associated 
 slide
  $('.carousel-indicators li').each(function(){
    var $slideValue = $(this).attr('data-slide-to');
    if($currentSlide == $slideValue) {
    $(this).addClass('active');
    $item.eq($slideValue).addClass('active');
  } else {
    $(this).removeClass('active');
    $item.eq($slideValue).removeClass('active');
  }
  });

 //This makes sure the image fits the screen, and adding a background color
 $('.carousel img').each(function() {
   var $src = $(this).attr('src');
   var $color = $(this).attr('data-color');
 $(this).parent().css({
  'background-image' : 'url(' + $src + ')',
  'background-color' : $color
  });
 $(this).remove();
  });

//each image will stay for 4 seconds
 $('.carousel').carousel({
   interval: 4000,
   pause: "false"
 });

//if the window resizes, the image will still have the height
  $(window).on('resize', function (){
  $wHeight = $(window).height();
  $item.height($wHeight);
});
})

0 个答案:

没有答案