LightBox issue on WebKit browsers Mac (PC not confirmed)

squal · 17 Dec 2010, 01:02

When set as an iFrame I get, on WebKit browsers, an empty black lightbox with arrows on each side. As if set for a slideshow.

I've tried my code on the page I needed it. And then I tried on a simple facelets page. Even the code snippet on the website didn't work:

Code: Select all

<?xml version='1.0' encoding='UTF-8' ?> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.prime.com.tr/ui">
    
    <h:head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <link href="./resources/css/default.css" rel="stylesheet" type="text/css" />
        <link href="./resources/css/cssLayout.css" rel="stylesheet" type="text/css" />
        <title>Facelets Template</title>
    </h:head>
    
    <h:body>


<p:lightBox iframe="true" width="80%" height="80%">
    <h:outputLink value="http://www.primefaces.org" title="PrimeFaces HomePage">
        <h:outputText value="PrimeFaces HomePage"/>
    </h:outputLink>
 </p:lightBox>  
    </h:body>
    
</html>

This only happens on webkit. It's ok On IE and Firefox. Haven't tested Chrome on PC.

If anyone has any ideas on why this slideshow mode comes up, I would be very thankful. Also, is there a way of forcing it not to show up?

I've tried different doctypes too with same results.

Thanks.

kwintesencja · 17 Dec 2010, 01:50

http://primefaces.prime.com.tr/forum/vi ... f=3&t=6548

17 Dec 2010, 11:43

Yes you need f:view setting for webkit;

Code: Select all

<f:view contentType="text/html">
Your page here
</f:view>

squal · 18 Dec 2010, 00:09

Thanks very much. That worked.

It didn't work at first on my main page (not the simple example I pasted here) but that's because I was using a facelets template.

So in case anyone else is having that issue, if you have a facelts template, remember once you use <ui:composition> anything outside of that will be ignored.

So my template looks like this:

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Code: Select all

<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:f="http://java.sun.com/jsf/core"
  xmlns:ui="http://java.sun.com/jsf/facelets">
<f:view contentType="text/html">
    <h:head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <link href="css/style.css" rel="stylesheet" type="text/css" />
        <script src="js/cufon-yui.js" type="text/javascript"></script>

        <!-- links for this page only -->
        <ui:insert name="headLinks"/>
        <!-- links for this page only -->

        <title>Facelets Template</title>
    </h:head>

    <h:body>

        <ui:include src="header.xhtml">Top</ui:include>

        <ui:insert name="content"/>

        <ui:include src="footer.xhtml">Bottom</ui:include>
    </h:body>
</f:view>
</html>

LightBox issue on WebKit browsers Mac (PC not confirmed)

Who is online