1

两个谜题。

我有一个缩略图的图像索引,我想从每个特定的缩略图链接到更大图像的幻灯片,在与缩略图代表的图像相关联的幻灯片编号处。

幻灯片放映效果很好,并为每张幻灯片显示标题,但我不知道如何从幻灯片放映外部链接到序列中的特定幻灯片。

第二个难题:正如现在所写的那样,幻灯片只能从 1 线性运行到任何内容,并且关联标题,就好像无论显示什么图像,幻灯片都是从标题 1 开始的。因此,我也无法制作许多不同的 html 文档,每个文档都以我想要的图像开始幻灯片放映,这样虽然很乏味,但我可以从任何缩略图链接到幻灯片,从该图像开始幻灯片放映。但是标题和幻灯片是匹配的,所以这也不起作用——如果我放了除了 slide0 之外的任何其他图像,显示的标题仍然是与 slide0 关联的标题。如果我用序列中第一个以外的任何图像开始 id=slideshow,然后向前导航,我会得到图像 2,无论我从什么数字图像开始,

这是幻灯片脚本:

window.onload = initAll;

var currImg = 0;
var captionText = new Array(
"Wrangler, Darhat Valley, Mongolia",
"Graveyard, Camden, Maine",
"Pants, Inis Mór",
"Campfire Lake, Crazy Mountains, Montana",
"Campsite, Darhat Valley",
"Crazy Mountains, Montana",
"Cuddy, Bedlam",
"The River Styx",
"Fountain, Cambridge",
"Freezeout Lake, Spring Equinox 1",
"Freezeout Lake, Spring Equinox 2",
"Freezeout Lake, Spring Equinox 3",
"G. I. Joe, Darhat Valley",
"Girls in Red, Renchilumbe, Mongolia",
"After spring rains, Montana",
"Lake Helena, Montana",
"Kapiti Coast, New Zealand",
"Lucky Star Bar, Inis Mór",
"On Ponsonby, Auckland",
"Holding Reservoir, Montana",
"Ferry, Darhat Valley",
"Baja",
"Saridag Inn, Renchilumbe",
"Skyscapes",
"Stanley Lane, Vermont",
"Bear Gulch, Montana",
"On the train between Brussels and Paris",
"Great blue heron",
"Tree, Tulla",
"Waves, Dun Aengus",
"Two ladies",
"Walls, Inis Mór",
"Wave, Dun Aengus",
"Storm light, Northampton"
)

function initAll() {
document.getElementById("imgText").innerHTML = captionText[0];
document.getElementById("prevLink").onclick = processPrevious;
document.getElementById("nextLink").onclick = processNext;
}

function processPrevious() {
newSlide(-1);
}

function processNext() {
newSlide(1);
}

function newSlide(direction) {
var imgCt = captionText.length;

currImg = currImg + direction;
if (currImg < 0) {
    currImg = imgCt-1;
}
if (currImg == imgCt) {
    currImg = 0;
}
document.getElementById("slideshow").src = "slides/slides" + currImg + ".png";
document.getElementById("imgText").innerHTML = captionText[currImg];
}

我不是程序员,这可能很明显。我改编提供的脚本。

感谢您提供任何帮助。

4

1 回答 1

0

我认为你的问题的关键在于这newSlide(direction)条线。如果您修改此函数以接受图像编号而不是方向,则可以在需要时调用它:

// Since this function handles backwards movement, keep all backwards-moving
// logic contained inside of it. Same for forward movement.
function prev() {
    currImg = currImg - 1;

    // This should be called from the wherever prev() is called from,
    // but for the sake of the example I'll include it here.
    show();
}

function next() {
    currImg = currImg + 1;

    // ...see above...
    show();
}

// Make sure the currImg is valid here, whenever you need to.
function check() {
    if (currImg >= captionText.length) {
        currImg = 0;
    }

    if (currImg < 0) {
        currImg = captionText.length - 1;
    }
}

// Now, this function shows whatever slide, whatever caption.
function show() {
    check();
    document.getElementById("slideshow").src = "slides/slides" + currImg + ".png";
    document.getElementById("imgText").innerHTML = captionText[currImg];
}


function initAll() {
    document.getElementById("imgText").innerHTML = captionText[0];
    document.getElementById("prevLink").onclick = processPrevious;
    document.getElementById("nextLink").onclick = processNext;

    // You can set the image you want during init, or update it in 
    // a different function and show() again.
    currImg = 0;
    show();
};

要将图像设置为您想要的任何内容,您可以currImg根据需要使用 GET 或表单输入或其他方式进行修改。

于 2013-10-25T06:39:44.663 回答