1

我是这里的新手，也是 JQuery/Javascript 的新手——我有 2 个问题。

如果您在此处下载文件，我将不胜感激！- 因为这是让自己清楚的更简单的方法 - 我希望。

我将Coin Slider用于主画廊，我需要在幻灯片下查看所有画廊图片（使用小图片）和幻灯片，当点击图片时，它应该以全屏视图打开（使用大图片）Fancybox灯箱库的帮助。

所以...

问题1：在幻灯片下，以拇指显示画廊中的所有图片。当前未显示 - 设法显示某张图片，但与所有画廊无关。

问题 2：当点击图片时，当前在幻灯片中 - 应该在全屏视图中打开。目前似乎与Coin Slider冲突，因为文件中未链接Coin Sliderindex.html时，全屏视图有效，但图片以列表模式显示。

我相信并希望在Coin Slider文件中需要对拇指（问题 1）进行小的更正，index.html并在全屏视图中进行一些代码更正（问题 2）。

这是一篇很长的文章——感谢您阅读到最后，并对可能出现的语法错误表示歉意（我不会说英语）。

4

1 回答 1

1

我有同样的问题。我发现可以执行href与 Coin Slider 一起使用的 javascript 调用。例子：

href="javascript:alert('hello');"

从理论上讲，可以使用它来打开 Fancybox 画廊的特定元素。

我现在正在研究一个例子。

编辑：

这里是。假设我们有一个硬币滑块，如下所示：

<div id="coin-slider">
    <a href="javascript:box(0);"><img src="img/small/1.jpg"></a>
    <a href="javascript:box(1);"><img src="img/small/2.jpg"></a>
    <a href="javascript:box(2);"><img src="img/small/3.jpg"></a>
</div>

然后我们可以使用参数“i”创建一个名为“box”的函数，它将在位置“i”打开一个 Fancybox 画廊。

<script type="text/javascript">
    function box(i) {
        $.fancybox.open([
            {
                src  : 'img/big/1.jpg',
                opts : {
                    caption : 'Optional description 1'
                }
            },
            {
                src  : 'img/big/2.jpg',
                opts : {
                    caption : 'Optional description 2'
                }
            },
            {
                src  : 'img/big/3.jpg',
                opts : {
                    caption : 'Optional description 3'
                }
            }
        ], {
            loop : false, index : i
        });
    };
</script>

我正在使用 Fancybox 3，但我确信它可以被编辑以与其他版本一起使用。希望这可以帮助那里的人。

于 2017-04-07T23:43:33.770 回答