Lightbox Image Viewer in frames

**suehue** · 02-13-2006, 04:34 PM

I am trying to use the Lightbox Image Viewer in a frame with the HV Menu in one frame and the lightbox in the other. I do not know what I need to do to accomplish this, I am really not well versed in this. Any help would be appreciated. Thanks in advance - Susan

the url for this is: http://www.dynamicdrive.com/dynamici...tbox/index.htm

**jscheuer1** · 02-13-2006, 06:54 PM

That would be pretty complicated unless you would be happy with the lightbox effect only occupying the frame the script is in. I tested this out using an iframe and the effect was rather nice but, that is because I used a square iframe larger than any of the full sized images. This would be the way to go. To get this script to display the lightbox effect fullpage in a frameset would be hard, as many calls in the script to document and self would need to be changed to parent.document and parent.window but others would not and it would be tough to know which were which. I like the iframe idea for this and you could even still use frames but just have the lightbox in an iframe. The page with the iframe could be displayed in a frameset frame. The only deal breaker is if you need the entire screen to display your full sized images. Lightbox shouldn't be used this way though, because some folks will have small screens and/or windows.

**suehue** · 02-13-2006, 07:46 PM

When I click on the thumbnail in the frame, the picture opens up in another window and there is no overlay, etc. My pictures are only 500X375 so the size is not an issue. The script just won't work when I move the page into the frame. Independently it works fine, but we want the HV Menu to remain on the side, hence the use of frames. My other javascripts work fine with the transition from non-frames to frames. I can post the codes when I get home tonight if that would help. I don't have it uploaded and it is still in the planning stages.

**jscheuer1** · 02-13-2006, 11:08 PM

Well, I just did a test. I put my lightbox page which worked on its own inside a frame and it worked in there. As expected, the effect only encompasses the frame. I also put my other test page with the lightbox in an iframe inside one of the frames and it worked out well too.

**suehue** · 02-13-2006, 11:55 PM

I think I will start from scratch again and see what happens. I must have a bit of code out of whack somewhere. Thank you for your helpful input and I will let you know how it all turns out. Susan

**suehue** · 02-14-2006, 04:42 PM

When I comment out the onload line for the HV Menu, then the lightbox works. There is a conflict with the lightbox and HV Menu when it is in frames. They work together when there are no frames. (http://www.saintjohnlutheran.net/1_baptisms.html) which has the HV Menu across the top.

HV Menu for frames (in body section)

<body onload="javascript:{if(parent.frames[0]&&parent.frames['Menu'].Go)parent.frames['Menu'}.Go()}">

And the Lightbox (in head section)

<link rel="stylesheet" href="lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="lightbox.js"></script>

I really would like to use this Lightbox script as it is slick, but have exhausted my meager knowledge of how to fix this. Any help would be more than appreciated. Thank you in advance. Susan

**Twey** · 02-14-2006, 05:03 PM

The javascript: pseudo-URI has no place in event handlers. It is meant to be used to call Javascript from a URI.

Code:

<body onload="if(parent.frames[0] && parent.frames['Menu'].Go) parent.frames['Menu'}.Go();">

That code block is also unnecessary.

**suehue** · 02-14-2006, 05:33 PM

Ok, if I take the the

<body onload="javascript:{if(parent.frames[0]&&parent.frames['Menu'].Go)parent.frames['Menu'].Go()}">

out, then the Lightbox works just fine, but the HV Menu in the left frame freezes up. and the only place it will go back to is "Home" and then it just is stuck there. I know next to nothing about coding so I just follow the directions provided by the awesome people who develop these wonderful javascripts found here. If I cannot find a workaround, then I will just go back to my old thumbnail viewer.

Thank you for the quick response and I appreciate it. Susan

**jscheuer1** · 02-14-2006, 06:16 PM

Replace all that with the much simpler

:

Code:

<script type="text/javascript">
function hvMenuFramesInit(){
if(parent.frames[0]&&parent.frames['Menu'].Go)
parent.frames['Menu'].Go();
}

if ( typeof window.addEventListener != "undefined" )
    window.addEventListener( "load", hvMenuFramesInit, false );
else if ( typeof window.attachEvent != "undefined" )
    window.attachEvent( "onload", hvMenuFramesInit );
else {
    if ( window.onload != null ) {
        var oldOnload = window.onload;
        window.onload = function ( e ) {
            oldOnload( e );
            hvMenuFramesInit();
        };
    }
    else
        window.onload = hvMenuFramesInit;
}
</script>

<body>

Untested but, should work. Don't forget to still include the body tag (shown in green above).