DMXzone Lightbox Support Product Page

QUESTIONS

DMX Lightbox

Asked 20 Nov 2012 03:26:23

have this question

20 Nov 2012 03:26:23 Bob Killilea posted:

DMX Lightbox: From my main page, I want to setup a link to a subpage -- that automatically loads a Lightbox over the subpage content when the subpage is first loaded. I've tried the FAQ instructions and can't get it to work. Basically, how do I automatically open a lightbox when a page first loads? Please show full code examples if possible.

Replies

Vulcho Vulev

Replied 20 Nov 2012 07:50:52

20 Nov 2012 07:50:52 Vulcho Vulev replied:

Hello Bob and welcome to Dmxzone Support Forum.

Please provide us with link to your page where we can inspect your code.

Regards:Vulcho.

Bob Killilea

Replied 20 Nov 2012 12:29:06

20 Nov 2012 12:29:06 Bob Killilea replied:

Hi Vulcho,
I have three pages that I'm using to test this:

www.mediasmyth.net/LB-main.html
www.mediasmyth.net/LB-subpage.html
www.mediasmyth.net/LB-content.html

"Main" contains the text link
"subpage" contains the Lightbox script
"content" contains the page displayed by Lightbox

When "subpage" is first loaded the Lightbox is not opening automatically.

Vulcho Vulev

Replied 20 Nov 2012 13:37:48

20 Nov 2012 13:37:48 Vulcho Vulev replied:

Hello Bob.

Here is the workaround.

Create a blank testpage on your siteroot directory.
After that create a sample text.

Example:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
LINK TO SUBPAGE
</body>
</html>

</body>
</html>

Markup the text ("LINK TO SUBPAGE" in my example) and through the user interface button from the dmxzone toolbar. Select Lightbox link and enter the url for your subpage that you want to display in lightbox:
www.mediasmyth.net/LB-subpage.html

your code will look like:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<!--[if IE]><script type="text/javascript" src="dmx/lib/excanvas-compressed.js"></script><![endif]-->
<link rel="stylesheet" type="text/css" href="dmx/widgets/Lightbox/styles/default/style.css" />
<script type="text/javascript" src="ScriptLibrary/jquery-latest.pack.js"></script>
<script type="text/javascript" src="dmx/dmx.core.js"></script>
<script type="text/javascript" src="dmx/widgets/Lightbox/dmx.lightbox.js"></script>
</head>

<body>
<a href="http://www.mediasmyth.net/LB-subpage.html " rel="dmxLightbox">LINK TO SUBPAGE</a>
</body>
</html>

If you want your page to open lightbox imediatly as the page loads and show that subpage in the link, you will need to execute through taginspector the behavior "Open Dmxzone Lightbox".

Your code will look like:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<!--[if IE]><script type="text/javascript" src="dmx/lib/excanvas-compressed.js"></script><![endif]-->
<link rel="stylesheet" type="text/css" href="dmx/widgets/Lightbox/styles/default/style.css" />
<script type="text/javascript" src="ScriptLibrary/jquery-latest.pack.js"></script>
<script type="text/javascript" src="dmx/dmx.core.js"></script>
<script type="text/javascript" src="dmx/widgets/Lightbox/dmx.lightbox.js"></script>
<script type="text/javascript">
function openDMXzoneLightbox(arg, options, context) {//v1.2
		context = context || window, options = options || {};
		if (context.DMX && context.DMX.Lightbox) {
			context.DMX.Lightbox.open(options.plugin || "", arg, options);
      document.MM_returnValue = false;
		}
	}
</script>
</head>

<body onload="openDMXzoneLightbox('http://www.mediasmyth.net/LB-subpage.html', {}, window);return document.MM_returnValue">
<a href="http://www.mediasmyth.net/LB-subpage.html " rel="dmxLightbox">LINK TO SUBPAGE</a>
</body>
</html>

Bob Killilea

Replied 20 Nov 2012 14:22:16

20 Nov 2012 14:22:16 Bob Killilea replied:

Still confused. Here's another attempt at explaining what I want to do:

From the text link on the page "LB-main.html" load the page "LB-subpage.html". (this is just a simple link)

When "LB-subpage.html" is displayed, automatically open the page "LB-content.html" inside the Lightbox (over the LB-subpage.html page).

The content for the Lightbox page is "LB-content.html".

Teodor Kuduschiev

Replied 20 Nov 2012 14:38:57

20 Nov 2012 14:38:57 Teodor Kuduschiev replied:

Hello,

I am not sure i understand what exactly are you trying to achieve but answering this question:

QuoteBasically, how do I automatically open a lightbox when a page first loads?

Select your Body tag, go to Tag Inspector > Behaviors > Add new > DMXzone > Open DMXzone Lightbox.

This applies the lightbox popup on page load (onLoad)

DMXzone Lightbox Support Product Page

QUESTIONS

DMX Lightbox

Replies

Reply to this topic