Question

我正在使用下面的jquery .cycle插件代码，用于带有next / prev按钮的照片幻灯片。一切都在Firefox和Chrome中完美运行，但在IE8中则不然。单击其中一个按钮并将幻灯片更改为下一张照片后，两个按钮向上移动大约10-15个像素。然后他们呆在那里直到我再次盘旋在他们身上。当我再次点击时，它们再次向上移动。我一直在寻找谷歌和论坛的答案，没有运气。我尝试了不同的方法，甚至用不同版本的JQuery测试它，但我无法解决它。有谁知道如何解决这个问题？谢谢！

<head>

$(function(){
    $("#imgslide").cycle({next:"#next",
              prev:"#prev",
              pause:true, 
              timeout:0,
              cleartypeNoBg: true,
              after: onAfter,

              });
});

function onAfter(curr,next,opts) {
            var index=opts.currSlide;
        $('#comment p:visible').hide();
            $('#comment p').eq(index).show();
        var caption = '' + (opts.currSlide + 1) + ' / ' + opts.slideCount;
        $('#caption').html(caption);
}

</head>

<body>

<div id="Container">
        <ul id="imgslide" style="height: 500px; list-style-type: none; margin:0; padding:0;">
            <li><img src="/images/portrait/image1.jpg" width="500px" height="500px"></li>
            <li><img src="/images/portrait/image2.jpg" width="500px" height="500px"></li>
            <li><img src="/images/portrait/image3.jpg" width="500px" height="500px"></li>
            <li><img src="/images/portrait/image4.jpg" width="500px" height="500px"></li>
            <li><img src="/images/portrait/image5.jpg" width="500px" height="500px"></li>
            <li><img src="/images/portrait/image6.jpg" width="500px" height="500px"></li>
            <li><img src="/images/portrait/image7.jpg" width="500px" height="500px"></li>
            <li><img src="/images/portrait/image8.jpg" width="500px" height="500px"></li>
        </ul>
        <div id="comment">
               <p>Title 1</p>
               <p>Title 2</p>
               <p>Title 3</p>
               <p>Title 4</p>
               <p>Title 5</p>
               <p>Title 6</p>
               <p>Title 7</p>
               <p>Title 8</p>
               </div>
        <a id="prev" style="cursor: pointer;" >Prev</a> |
        <a id="next" style="cursor: pointer; margin-left:2px">Next</a>
        <div style="display:inline; margin-left:10px" align="left" id="caption"></div>
</div>

</body>

Answer 1

我解决了问题;

我使用的是最新的JQuery 1.7.2版本。相反，我使用以下路径将其更改为1.5版;
```
http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js
```
对于Jquery Cycle插件，我使用的是jquery.cycle.lite.js，这是较小的版本，但我将其更改为包含更多功能的完整版本;
```
http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js
```

这些更改似乎修复了与Internet Explorer IE8中出现的按钮相关的错误。现在，该页面在所有浏览器中都可以正常运行。

IE上有奇怪的jquery .cycle插件/ prev按钮行为

1 个答案: