IE 8中的jQuery EasySlider 1.7小故障

我的主页上有一个EasySlider幻灯片，在Firefox和Chrome中效果很好，但在IE中没有。我特别需要帮助的问题出现在IE7和IE8中

如果单击上一个箭头从第一张幻灯片转到最后一张幻灯片，则最后一张幻灯片中的图像从左侧开始，然后跳到其所属的右侧。从最后一张幻灯片过渡到第一张幻灯片时，第一张幻灯片上的图像也会发生同样的情况。此问题仅在这两张幻灯片上出现，并且仅在从第一张幻灯片向后移动到最后一张幻灯片（最后一张幻灯片出现故障）和从最后一张幻灯片向前移动到第一张幻灯片（第一张幻灯片出现故障）时才会出现

HTML

<div id="slider">
    <ul>
        <li>
            <article id="architectural-illustration">
                <div class="slider-text">
                    <h1>A Fresh Look @ Architecture</h1>
                    <p>With over 10 years of architectural design experience we are able to create beautifully rendered 3D models and plans for almost any size or type of project using the latest in CAD technology. Let us help bring your projects to life!</p>
                    <p>seeing is believing: <a href="#">Drawing Board</a></p>
                </div>
                <div class="architectural-illustration-image">
                    <img alt="3D model of residential floorplan" src="images/drafting-3d-models-scroller.png" width="469" height="350" />
                 </div>
            </article>
        </li>
        <li>
            <article id="web-design">
                <div class="slider-text">
                    <h1>High Flying Web Designs</h1>
                    <p>No "cookie cutter" designs here! We believe that each client has its own story to tell. Our designs come from working closely with you. Give your site the look and feel needed to tell who you are.</p>
                    <p>preflight check: <a href="#">See Our Work</a></p>
                </div>
                <div class="web-design-image">
                    <img alt="binary code flag" src="images/web-designs-scroller.jpg" width="395" height="320" />
                </div>
            </article>
        </li>
        <li>
            <article id="3d-illustration">
                <div class="slider-text">
                    <h1>Product Illustration</h1>
                    <p>Whether your product is existing or a new idea, we can bring it to life. From still frames to full blown 3D animations, get the right tools to market your product.</p>
                    <p>sneak a peak: <a href="#">Examples</a></p>
                </div>
                <div class="model-image">
                    <img alt="3d illustration of shoring product" src="images/3d-product-illustration-scroller.png" width="397" height="315" /> 
                </div>
            </article>
        </li>
        <li>
            <article id="mobile-web">
                <div class="slider-text">
                    <h1>Make it mobile.</h1>
                    <p>Because websites are typically optimized for desktop usability, they don't follow the guidelines necessary for usable mobile access. "Bah Humbug!" With the mobile world advancing each and every day, we have solutions to make sure your web site goes everywhere you do.</p>
                    <p>learn more: <a href="#">Free Consultation</a></p>
                </div>
                <div class="mobile-web-image">
                    <img alt="mobile phone showing optimized website" src="images/mobile-website-solutions-scroller.jpg" width="401" height="353" />
                </div>
            </article>
        </li>
    </ul>
</div> <!-- end #slider div -->  

<script type="text/javascript">
$(document).ready(function() {
                           $("#slider").easySlider({
                                                   auto: true,
                                                   continuous: true
                                                   });
                           });
</script>  

#slider ul, #slider li {
margin:0;
padding:0;
list-style:none;
}
#slider, #slider li {
margin-bottom:20px;
background-color:#fff;
width:960px;
height:375px;
overflow:hidden;
}
#slider article{
width:960px;
height:375px;
}
#slider article p {
margin-top:20px;
}
#slider article div.slider-text {
width: 470px;
margin:20px;
margin-right:0px;
float:left;
}
#slider article div.architectural-illustration-image,
#slider article div.web-design-image,
#slider article div.model-image,
#slider article div.mobile-web-image {
width:470px;
float:right;
overflow:hidden;
}
#slider article div.architectural-illustration-image {
margin-right:0px;
margin-top:25px;
width:462px;
height:337px;
}
#slider article div.web-design-image {
margin-right: 20px;
margin-top:55px;
height:320px;
width:395px;
}
#slider article div.model-image {
margin-right:50px;
margin-top:25px;
height:315px;
width:397px;
}
#slider article div.mobile-web-image {
margin-right:0px;
margin-top:22px;
width:401px;
height:353px;
}  

---

任何帮助都将不胜感激。谢谢

这解决了我遇到的一个定位问题，不确定它是否适用于这个特定的bug，但值得一试。就像

#slider{position:relative；}

找到一样简单

我也有同样的问题。你有办法吗？