javascript - 单击时更改图像集 - Fotorama

Question

当我单击 div 时，有没有办法更改 Fotorama 中的图像？

例如，我有两个 div，一个名为#NYPhotos，另一个名为#WAPhotos。当我点击 div #NYPhotos 时，Fotorama 会出现在它的下方，显示我在纽约拍摄的照片。之后，当我单击#WAPhotos 时，fotorama 中的图像将交换为华盛顿的照片。

我能够让 Fotorama 与纽约的照片一起出现，但尝试交换图像时没有运气......有什么想法吗？

Answer 1

首先，我建议阅读这个问题的答案，这应该会有所帮助：How to change an image on click using CSS only?

如果您不想阅读，那么基本上主要思想是：

input[type="checkbox"]:before {
     content: url('images/icon.png');
     display: block;
     width: 100px;
     height: 100px;
}
input[type="checkbox"]:checked:before {
content: url('images/another-icon.png');
}

只需使用 CSS 将每个部分设为 div 即可。希望这有帮助！