簡體   English   中英

jquery ie7問題

[英]jquery ie7 problem

嗨,我對 javascript 和 jquery 的了解非常基礎,所以我知道問題的原因是什么。

我創建了一個簡單的 slider 來顯示兩條消息,因此一條顯示和幻燈片顯示第二條,但它在 ie7 中不起作用,我嘗試了 ie8、chrome、firefox 和歌劇中的代碼,它可以工作。

這是我的代碼:

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();
});

在 IE7 中查看這里

適用於 Mac 上的 Fx4 和 Windows 上的 IE8。 抱歉我沒有IE7

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

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM