jquery - 使用 jQuery 构建带有画廊的产品页面

Question

我正在帮助客户建立一个产品网站，其中一个页面显示了他们销售的产品的详细信息。产品详细信息页面的要求之一是拥有产品的多个图像（我很好，将实现一个滑块）但是产品图像也将采用不同的颜色。根据用户选择的颜色，显示相关的产品图像。我在如何实现颜色选择选项时遇到问题。

我在另一个页面上使用 BX-Slider ( http://bxslider.com/ )，因此希望能够重复使用相同的滑块。有人给我任何指示吗？

我在这里包含了产品页面的设计：

非常感谢任何帮助！

Answer 1

我从来没有使用过 bxslider，但看起来你可以利用它来发挥你的优势：

http://bxslider.com/examples/custom-next-prev-selectors

如果您创建自定义上一个/下一个选择器，那么您可以创建一个索引，以便您知道当前在滑块中选择了哪种颜色，然后显示相应的图像。使用自定义选择器，这将在JQuery.click()两个跨度的函数中完成（在示例中）。

$("#slider-next").click(...change image to index + 1...);
$("#slider-prev").click(...change image to index - 1...);