PDA

View Full Version : Ajax Tabs & Javascript



jc_gmk
09-07-2007, 09:05 AM
1) Script Title: Ajax Tabs Content script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/ajaxtabscontent/index.htm

3) Describe problem:

I have created a web page that displays some images, these images have a reflection added to them using javascript (to save me editing hundreds of pictures). This all works fine!
However, I have now added Ajax tabs to call the images from an external page and now I can't seem to get the Javascript to work!

Part of the instructions for the ajax tabs says you can do this by adding rev="reflection.js" e.g. <a href="ajax/externalpage1.php" rel="ajaxcontentarea" rev="reflection.js">TAB1</a>

The external pages just contain img links e.g. <img src="image1.jpg" class="reflect" />
I use the class="reflect" to call the javascript.

Any ideas why this should not be working?

ddadmin
09-08-2007, 07:13 AM
In cases where the JavaScript within the external page is executed on run time (such as the reflection effect), using Ajax to fetch it won't work. What you can do is first create a blank HTML page (ie: externalpage.htm), then inside it, create a <iframe> tag that calls the desired external page with the dynamic content: (ie: dynamic.htm). Something like:


<iframe src="dynamic.htm" style="margin:0; padding:0; width:100&#37;; height: 100%"></iframe>

Then inside the Ajax Tabs script, have one of the tabs call externalpage.htm.

yoyotheboss7
10-19-2007, 04:09 AM
The problem with your solution, the image won't be open in the whole page. The black background would be open only in the iframe with the picture inside. I can have a iframe in the whole page...
Have you another solution than iframe or a solution to open the image in the parent page and not in the iframe ?
Thanks a lot !
Yoann :)

kiteflute
10-19-2007, 04:37 AM
Can Ajax tab load content in one page?

jscheuer1
10-19-2007, 04:46 AM
The problem with your solution, the image won't be open in the whole page. The black background would be open only in the iframe with the picture inside. I can have a iframe in the whole page...
Have you another solution than iframe or a solution to open the image in the parent page and not in the iframe ?
Thanks a lot !
Yoann :)

Which scripts are you talking about exactly?

ddadmin
10-19-2007, 05:39 AM
The problem with your solution, the image won't be open in the whole page. The black background would be open only in the iframe with the picture inside. I can have a iframe in the whole page...
Have you another solution than iframe or a solution to open the image in the parent page and not in the iframe ?
Thanks a lot !
Yoann :)

That's what the Ajax option does, though as discussed above, it has its shortcomings if the external page contains certain types of JavaScript or CSS.

yoyotheboss7
10-19-2007, 05:58 AM
I'm talking about the about this script : http://www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm
I want to setup a lightwindow like the link bellow in a page open with the dynamic ajax content :
http://www.dynamicdrive.com/dynamicindex4/lightbox2/index.htm

The javascript is blocked in the new page. If I put my script in a iframe inside my new page, it works, but it takes the size of the iframe.:mad:
Thanks for your help :)

jscheuer1
10-19-2007, 06:17 AM
I'm talking about the about this script : http://www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm
I want to setup a lightwindow like the link bellow in a page open with the dynamic ajax content :
http://www.dynamicdrive.com/dynamicindex4/lightbox2/index.htm

The javascript is blocked in the new page. If I put my script in a iframe inside my new page, it works, but it takes the size of the iframe.:mad:
Thanks for your help :)

That's what I thought you were working with, but I wasn't sure. For an iframe, there is always Lytebox:

http://www.dolem.com/lytebox/

I'm not sure how that script will react in an iframe and also loaded via Ajax. Assuming that's your intention.

Using the regular lightbox v2.03 with Ajax is pretty easy. You put the lightbox scripts and style links on the top page. On your external pages, use the hard coded onclick event with each lightbox link, ex (from the demo page, addition red):


<a href="images/image-1.jpg" rel="lightbox" onclick="myLightbox.start(this); return false;" title="my caption">image #1</a>

yoyotheboss7
10-19-2007, 07:04 AM
I have try with lytebox, but it doesn't work...:mad:
Is it possible to add a parameter in the dynamic ajax content for the function loadjobs() like this ?
fileref.setAttribute("media", "screen");

I have respect what they say for iframe, but it doesn't work. The lytebox.css is load with my page with the function loadjobs and I include lytebox.js in my iframe. I think the script work because my images are loaded and I have no javascript error. But I can't see the pictures ! Any idea ?:p

yoyotheboss7
10-19-2007, 07:32 AM
I find the problem...I should give a name to my iframe.
Thanks a lot for your help !:)