Question

喜我对javascript和jquery的了解非常基础，所以我知道问题的原因是什么。

我创建了一个简单的滑块来显示两条消息，所以一个显示，幻灯片显示第二个，但它在ie7中不起作用，我已经尝试了ie8，chrome，firefox和opera中的代码，它的工作原理。

这是我的代码：

HTML：

<head>
    <link rel="stylesheet" href="style.css" type="text/css" media="screen" /> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.cycle.js"></script>
    <script type="text/javascript" src="js/slideshow.js"></script>
</head>
<body>
    <div id="slideshow">
            <div class="slides">
                <ul>
                    <li id="slide-one">
                        <h3>slider 1</h3>
                        <p>content goes here
                        <br/><a href="#">Read More</a></p>
                    </li>
                    <li id="slide-two">
                        <h3>slider 2</h3>
                        <p>content goes here
                        <br/><a href="#">click here</a></p>
                    </li>
                </ul>
            </div>
            <a href="# "id="designer"></a>
        </div>

</body>
</html>

的CSS：

#slideshow {
display: block;
margin: 0px auto 0px auto;
width: 520px;
height: 100px;
background-color: black;
color: black;
padding: 5px 5px 5px 5px;
font-family: Helvetica;
clear: both;
}

#slideshow h3 {
color: #aa102c;
}


.slides {    
height: 100px;
width: 520px;
overflow: hidden;
background-color: white;
float: right;
}

#slide-one {
width: 515px;
height: 100px;
margin-left: 5px;
}

#slide-two {
width: 515px;
height: 100px;
margin-left: 5px;
}

#slideshow .slides h3 {
margin-top: 0;}

JS：

$slideshow = {
    context: false,
    tabs: false,
    timeout: 5000,
    slideSpeed: 2000,
    tabSpeed: 300,
    fx: 'scrollLeft',

    init: function() {

        this.context = $('#slideshow');

        this.tabs = $('ul.slides-nav li', this.context);


        this.prepareSlideshow();
    },

    prepareSlideshow: function() {

        $('div.slides > ul', $slideshow.context).cycle({
            fx: $slideshow.fx,
            timeout: $slideshow.timeout,
            speed: $slideshow.slideSpeed,
            fastOnEvent: $slideshow.tabSpeed,
            pager: $('ul.slides-nav', $slideshow.context),
            pagerAnchorBuilder: $slideshow.prepareTabs,
            before: $slideshow.activateTab,
            pauseOnPagerHover: true,
            pause: true
        });            
    },

    activateTab: function(currentSlide, nextSlide) {

        var activeTab = $('a[href="#' + nextSlide.id + '"]', $slideshow.context);

    }            
};


$(function() {

    $('body').addClass('js');

    $slideshow.init();
});

Answer 1

在IE7中查看

适用于Mac上的Fx4和Windows上的IE8。对不起，我没有IE7

http://jsfiddle.net/mplungjan/zHuqj/

jquery ie7问题

1 个答案: