Ajax + lightbox

**Spafe** · 07-14-2006, 08:48 AM

<3

No more needs to be said

**waynep** · 08-03-2006, 08:58 PM

i had to bring this one back from the dead, im using the tabs ajax script here

http://www.dynamicdrive.com/dynamici...tent/index.htm

and my external file for instance test.htm has an image with rel="lightbox" but this wont work inside my dynamic content !

ive tried copying some actions from here but its not even loading my test.htm into the tab now.

if some one cares to have a look here , yee shall see !

http://www.mediapixel.co.uk/portfolio.htm

try clicking "the problem tab" also please refer to my source code to see how im trying to get it working, any help is much appriciated.

**jscheuer1** · 08-04-2006, 03:56 AM

This is a little silly because, the ajaxtab script is not executing, even without your call to:

pollContent('1');

Start over. Get ajaxtab and lightbox working on the same page first. Once you have that much working, or are having a problem doing so, get back to us. Forget about (for the time being) having lightbox work on content loaded by ajaxtabs.

**waynep** · 08-04-2006, 07:50 AM

Originally Posted by jscheuer1

This is a little silly because, the ajaxtab script is not executing, even without your call to:

pollContent('1');

Start over. Get ajaxtab and lightbox working on the same page first. Once you have that much working, or are having a problem doing so, get back to us. Forget about (for the time being) having lightbox work on content loaded by ajaxtabs.

my other tabs do work , i just havnt made external pages yet , thats why it constantly says refreshing content

sorry , i can understand how that migh of seemed confusing ! lightbox works on that page and so does the ajax tabs, its just the tab with PROBLEM TAB which im trying to call the test.htm file with lightbox content..

thanks.

**jscheuer1** · 08-04-2006, 08:01 AM

OK, then what does your pollContent() function look like? Where is it? What is '1'?

**waynep** · 08-04-2006, 08:04 AM

Originally Posted by jscheuer1

OK, then what does your pollContent() function look like? Where is it? What is '1'?

i just copied your code from above !

and put this in my header

<script type="text/javascript">
function pollContent(id){
if(document.getElementById(id))
initLightbox();
else
setTimeout("pollContent('"+id+"')", 1000)
}
</script>

i didnt have a clue, so i tried it and it didnt work

ill edit the page so you can see my dynamic page in that tab that ive tried modifying . 1 sec

i have removed all other tabs to avoid confusion ! you can see the external file loads sussecfully because when you do the stylesheet changes text size slightly

but the picture using rel tag just opens in new window and not lightbox

**jscheuer1** · 08-04-2006, 08:09 AM

Your test.htm should look like so:

HTML Code:

<html>
<head>
<title>h</title>

</head>
<body>


<a href="images/image-1.jpg" rel="lightbox"><img src="images/thumb-1.jpg" width="100" height="40" alt="" /></a>
<span id="test1"></span>


</body>
</html>

and your call like so:

<li><a href="javascript:ajaxpage('test.htm', 'ajaxcontentarea');pollContent('test1');">THE PROBLEM TAB</a></li>

**waynep** · 08-04-2006, 08:14 AM

i have made changes accordingly but still no joy you can see the page here

http://www.mediapixel.co.uk/portfolio.htm

the external tab works as normal but problem tab still doesnt !

ie gives the javascript error "ParentNode is null or not an object"

**jscheuer1** · 08-04-2006, 08:33 AM

Take this off of test.htm:

Code:

<link rel="stylesheet" href="lightbox2.css" type="text/css" media="screen" />
	<script src="j/prototype.js" type="text/javascript"></script>
	<script src="j/scriptaculous.js?load=effects" type="text/javascript"></script>
	<script src="j/lightbox.js" type="text/javascript"></script>

	<style type="text/css">
		body{ color: #333; font: 13px 'Lucida Grande', Verdana, sans-serif;	}
	</style>

There may be other problems.

**waynep** · 08-04-2006, 08:37 AM

Originally Posted by jscheuer1

Take this off of test.htm:

Code:

<link rel="stylesheet" href="lightbox2.css" type="text/css" media="screen" />
	<script src="j/prototype.js" type="text/javascript"></script>
	<script src="j/scriptaculous.js?load=effects" type="text/javascript"></script>
	<script src="j/lightbox.js" type="text/javascript"></script>

	<style type="text/css">
		body{ color: #333; font: 13px 'Lucida Grande', Verdana, sans-serif;	}
	</style>

There may be other problems.

i removed that but the page wont load into the ajaxcontentarea using this line

<li><a href="javascript:ajaxpage('test.htm', 'ajaxcontentarea');pollContent('test1');">THE PROBLEM TAB</a></li>

Thread: Ajax + lightbox

Thread Tools

Search Thread

Bookmarks

Bookmarks

Posting Permissions