jsf - 带有 p:graphicImage 的图像弹出窗口

Question

我有一个简单的 jsf primefaces 代码使用p:graphicImage

<p:graphicImage value="#{imageStreamer.image}" >
    <f:param name="id" value="#{item}" />
</p:graphicImage>

我正在尝试添加“点击图片弹出”功能。我看到了一个使用 jquery 弹出的图像列表

我决定使用 fancyBox，但我不知道如何将它与 primefaces graphicsImage 一起使用。任何人都可以帮忙吗？

它不必是 fancyBox 或任何其他 jquery 插件。我只需要一个简单的“点击图片弹出”功能。

更新

尝试使用Lightbox但它不起作用

<p:galleria id="photo-galleria" value="#{testController.ImageIdsView(list[1])}" var="item" autoPlay="false" frameWidth="200" frameHeight="188" panelWidth="625">  
    <p:lightBox styleClass="imagebox">  
        <h:outputLink value="#{imageStreamer.image}">  
            <p:graphicImage value="#{imageStreamer.image}" >
                <f:param name="id" value="#{item}" />
            </p:graphicImage>
        </h:outputLink>
    </p:lightBox>
</p:galleria>

这些图像给了我一个断开的链接。

注意：没有lightbox，一切正常。

Answer 1

PrimeFaces 有这方面的东西。它被称为灯箱。

有关示例，请参见此处的展示柜。