Topic: div over iframe (an image overlays simpleviewer)

Hi it's me again  smile !

I added SVpro2 into the header of my website thanx to iframe (and also Mike Richards).
Anyway, I want one of my pictures in the header overlays a part of my simpleviewer gallery.

Or in other words I  would like 

<div>

overlays

<iframe>

where my gallery is.

I found this code on this great website http://jsfiddle.net/vkpYk/which is exactly what I want. It is set with

z-index

. But then I tried it with my own SV iframe and it doesn't work. SV is always over everything else, no matter the z-index...

Does any one knows how to do it ?

thanx a lot !

Re: div over iframe (an image overlays simpleviewer)

First, make your gallery's background transparent: http://simpleviewer.net/simpleviewer/su … ml#embed_6
Then you can position your <div> absolutely over where the <iframe> appears on the page.
In the <head> section, use something like:

<style type="text/css">
    #overlay {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 1;
    }
</style>

... and in the <body> section:

<div id="overlay"><img src="image.jpg" width="200" height="100" alt="image" /></div>

Giving the <div> a z-index of 1 or above will result in the image being overlaid on top of everything (the HTML page and the <iframe> including the gallery). A value of -1 or below will result in the image being displayed beneath the HTML page and <iframe>. For -1 to work as expected in Internet Explorer, you'll need to add the attribute allowtransparancy="true" to your opening <iframe> tag, eg:

<iframe src="index.html" width="800" height="600" frameborder="0" scrolling="no" allowtransparency="true"></iframe>
Steven Speirs
SimpleViewer Support Team.

Re: div over iframe (an image overlays simpleviewer)

-Ok so it works fine in IE but I cannot navigate anymore in SV (it doesn't really matter since autplay is on)

-In firefox the gallery is placed properly but the gallery is frozen even with autoplay and the picture is resized in the middle of the gallery.

- In chrome the SV gallery works but is still over  the div...

any suggestion(s) ?

thanx !

Re: div over iframe (an image overlays simpleviewer)

If you overlay an image or another element over the gallery it may prevent you from being able to click on the gallery with a mouse.

Mike Richards
SimpleViewer Support Team.

Re: div over iframe (an image overlays simpleviewer)

fine, it doesn't bother me that much since I have autoplay on.

What about the Firefox issue ? SV doesn't work at all, the image is stuck, resized, the caption are displayed while they are not suppose to because I specified it.

thanx

Re: div over iframe (an image overlays simpleviewer)

Without being able to take a look at the page I'm not sure what to suggest.

Mike Richards
SimpleViewer Support Team.

Re: div over iframe (an image overlays simpleviewer)

I've uploaded the files I used for my test gallery here.
Unzip the file and open 'index.html' in your browser. (You'll need to put your own SimpleViewer Pro 'svcore' folder into the unzipped folder.)
You'll see that the image overlays both some standard HTML (the word 'Hello') and part of the <iframe> that loads the gallery ('main.html').
The XML options I used for the test are:

<simpleviewergallery
    autoPlayOnLoad="TRUE"
    buttonBarPosition="NONE"
    captionPosition="NONE"
    thumbPosition="NONE"
    title="SimpleViewer-Pro Gallery"
>

It seems to work fine in Firefox, IE, Chrome and Safari (no stuck image in Firefox).
Take a look at the files and see if it helps.

Steven Speirs
SimpleViewer Support Team.

Re: div over iframe (an image overlays simpleviewer)

Indeed, your example does work in firefow...
I guess I have to double check my code or I will send to you the adress once I will put the website online.
Thanx a lot !