eshop的全屏产品视图

Question

我正在尝试在下一个网站上找到产品全屏视图的插件或教程：

http://www.armaniexchange.com/product/cotton+trench+coat.do?sortby=

或

http://store-us.hugoboss.com/boss/partner-water-resistant-hooded-coat/hbna50238757,en_US,pd.html&cgid=22000#!i%3D0%26color%3D001_Black

也许有人会给我一个链接？）因为我老实说没有找到任何有用的东西。

小补充： 我的意思是什么？在hugoboss网站上，您可以点击图片下方的“全屏视图”或在armani网站上 - “查看更大”。 您将进入全屏视图。我正在寻找类似的东西。

提前致谢。

BR， 尼克K。

Answer 1

如果我理解你的问题 - 你正在寻找以下内容：

http://codecanyon.net/item/etalage/180719?ref=themespotters&ref=themespotters&clickthrough_id=119361192&redirect_back=true

修改

在这种情况下。在产品页面上，我可能会添加一个绝对定位的div，其宽度和高度均为100％;

.product-overlay {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    }

然后您可以使用jquery打开和关闭它。

$(function() {
    $('#fullscreen').click(function() { //This is your "Full Screen" link
        $('.product-overlay').show();
    });

    $('.product-overlay #close').click(function() { // This is your close button
        $('.product-overlay').hide();
    });
});