单击交叉淡入淡出背景图像

时间:2013-07-26 04:54:01

标签: javascript css

here中的java脚本代码是自动幻灯片图片,但是当我点击.box1类时,我需要将其转换为onclick代码。

当我点击box1类时,crosssfade只需对id = #main的背景图像有效。交叉淡入淡出不得对box1产生影响,并且当背景图像交叉淡入淡出时必须连续出现。

对于交叉淡化背景图像,图像必须直接连接到图像 夹。因为我需要在#main。

中连接图像文件夹和背景图像

有些人可以帮忙解决这个问题。

my code is here

var timer = setInterval(nextImage, 4000);
var curImage = 0;
var numImages = 5;

function nextImage() {
    var e;
    // remove showMe class from current image
    e = document.getElementById("slideimg" + curImage);
    removeClass(e, "showMe");
    // compute next image
    curImage++;
    if (curImage > numImages - 1) {
        curImage = 0;
    }

    // add showMe class to next image
    e = document.getElementById("slideimg" + curImage);
    addClass(e, "showMe");
}

function addClass(elem, name) {
    var c = elem.className;
    if (c) c += " ";  // if not blank, add a space separator
    c += name;
    elem.className = c;
}

function removeClass(elem, name) {
    var c = elem.className;
    elem.className = c.replace(name, "").replace(/\s+/g, " ").replace(/^\s+|\s+$/g, "");  // remove name and extra blanks
}

1 个答案:

答案 0 :(得分:0)

检查以下JSfiddle以点击

更改图像

http://jsfiddle.net/arunberti/cwP5Q/99/

在下面的代码中写下函数

$('#container').click(function() {

});