jquery兼容ie8的轮播图

以下是一个简单的 jQuery 轮播图插件，支持 IE8 及以上版本：

HTML：

<div class="slider">
  <ul class="slider-list">
    <li><img src="img/slider-1.jpg" alt=""></li>
    <li><img src="img/slider-2.jpg" alt=""></li>
    <li><img src="img/slider-3.jpg" alt=""></li>
  </ul>
  <div class="slider-nav">
    <a href="#" class="slider-prev">Prev</a>
    <a href="#" class="slider-next">Next</a>
  </div>
</div>

CSS：

.slider {
  position: relative;
  overflow: hidden;
}
.slider-list {
  position: absolute;
  top: 0;
  left: 0;
  width: 300%;
  list-style: none;
  margin: 0;
  padding: 0;
}
.slider-list li {
  float: left;
  width: 33.333%;
  height: 200px;
}
.slider-list li img {
  width: 100%;
  height: 100%;
  display: block;
}
.slider-nav {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translate(-50%, 0);
  z-index: 1;
}
.slider-nav a {
  display: inline-block;
  margin: 0 10px;
  padding: 5px 10px;
  background-color: #fff;
  border: 1px solid #ccc;
  color: #333;
  text-decoration: none;
}

JavaScript：

$(function() {
  var $slider = $('.slider');
  var $sliderList = $slider.find('.slider-list');
  var $sliderItem = $sliderList.find('li');
  var $sliderNav = $slider.find('.slider-nav');
  var $sliderPrev = $sliderNav.find('.slider-prev');
  var $sliderNext = $sliderNav.find('.slider-next');
  var sliderCount = $sliderItem.length;
  var currentIndex = 0;
  var slideWidth = $slider.width();
  var isAnimating = false;

  // 初始化
  $sliderList.css({ width: slideWidth * sliderCount });
  $sliderItem.css({ width: slideWidth });

  // 上一张
  $sliderPrev.on('click', function(e) {
    e.preventDefault();
    if (isAnimating) return;
    currentIndex--;
    if (currentIndex < 0) {
      currentIndex = sliderCount - 1;
    }
    sliderAnimate(currentIndex);
  });

  // 下一张
  $sliderNext.on('click', function(e) {
    e.preventDefault();
    if (isAnimating) return;
    currentIndex++;
    if (currentIndex > sliderCount - 1) {
      currentIndex = 0;
    }
    sliderAnimate(currentIndex);
  });

  // 动画
  function sliderAnimate(index) {
    isAnimating = true;
    $sliderList.animate({
      left: -slideWidth * index
    }, 500, function() {
      isAnimating = false;
    });
  }
});

注意事项：

1. 在 IE8 中，由于不支持 CSS3 transform 属性，所以需要使用 jQuery 的 animate() 方法来实现动画效果。
2. 在 IE8 中，需要将 JavaScript 代码放在 jQuery 库文件之后，否则会出现 $ 或 jQuery 未定义的问题。