更改背景图像,Jquery + CSS

时间:2010-02-05 18:53:47

标签: javascript jquery html css

我正在客户网站上工作,希望“cruise_offers”div上的背景图片能够改变,可能只有3-4张图像轮换。

我的jquery知识非常基础,所以任何帮助都会很棒。

我更喜欢使用jQuery,因为我在网站的其他地方使用它。

我的标记:

<div class="cruise_offers">
    <span class="overlay_bar">
        <a href="cruiseoffers.html">View our Great Cruise Offers</a>
    </span>
</div>

干杯

4 个答案:

答案 0 :(得分:2)

查看此链接 - 我在类似的工作上工作,这可能会有所帮助:

I found a jquery image rotatation script and adding hyperlinks to the images breaks the animation

答案 1 :(得分:2)

$(div.cruise_offers).removeClass('cruise_offers');
$(div.cruise_offers).addClass('cruise_offers1');

使用不同的背景图像在css中创建类。

答案 2 :(得分:1)

也许这样的事情会起作用(我还没有测试过)。

var current_image = 0;
var rotation_speed = 5000; //milliseconds
var where = $("div.cruise_offers");
var images = new Array();
    images[0] = 'img1.jpg';
    images[1] = 'img2.jpg';

function change_image() {
    current_image++;
    if (images[current_image].length == 0) {
        current_image = 0;  
    }
    $(where).css("background-image", "url("+images[current_image]+")")  
}

if (where.length != 0) {
    setTimeout("change_image()", rotation_speed);
}

答案 3 :(得分:0)

查看Cycle plugin并访问页面底部的演示以开始使用。