• From: Los Angeles, CA, US
  • Registered: 2008-05-01
  • Posts: 5

Topic: wmode=transparent=fail

Hello, my beloved Simpleviewer.  It's been 4 years since we last met, and I love the new tools.

I would like to put a logo and some menu items in my gallery, but have been unsuccessful. 

I have read all of the posts regarding hidden menus and images and have tried making everything in the universe transparent - in the embed code and the svBuilder, but I'm still not able to get a menu or an image to show up over the flash.

I'm using svBuilder and Dreamweaver CS5.  I have the latest version of Flash installed and I have cleared all caches ever created. 

The page I'm testing is awlphoto.com/ladies/index.html

Here is the code I'm currently using:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <title>LADIES</title>
</head>

<body>
<img src="../awlbannersmall2.jpg" width="148" height="148" alt="AWL PHOTO">
<!--START SIMPLEVIEWER EMBED.-->
<script type="text/javascript" src="svcore/js/simpleviewer.js"></script>
<script type="text/javascript">
var params={};
params.wmode="transparent";
simpleviewer.ready(function () {
simpleviewer.load("sv-container", "100%", "100%", "transparent", true, null, params);
});
</script>
<div id="sv-container"></div>
<!-- END SIMPLEVIEWER EMBED -->

</body>
</html>

Any help would be greatly appreciated, as I have spent the better part of the day troubleshooting this. 

Thanks in advance!

  • Registered: 2008-07-06
  • Posts: 6,334

Re: wmode=transparent=fail

When setting the gallery's backgroundColor Embed Code Parameter to 'transparent', SimpleViewer automatically sets the 'wmode' Flash Param to 'transparent' so you can replace the following:

<!--START SIMPLEVIEWER EMBED.-->
<script type="text/javascript" src="svcore/js/simpleviewer.js"></script>
<script type="text/javascript">
var params={};
params.wmode="transparent";
simpleviewer.ready(function () {
simpleviewer.load("sv-container", "100%", "100%", "transparent", true, null, params);
});
</script>
<div id="sv-container"></div>
<!-- END SIMPLEVIEWER EMBED -->

... with:

<!--START SIMPLEVIEWER EMBED.-->
<script type="text/javascript" src="svcore/js/simpleviewer.js"></script>
<script type="text/javascript">
simpleviewer.ready(function () {
simpleviewer.load("sv-container", "100%", "100%", "transparent", true);
});
</script>
<div id="sv-container"></div>
<!-- END SIMPLEVIEWER EMBED -->

If you would like your <img> to be superimposed on top of your gallery, then replace:

<img src="../awlbannersmall2.jpg" width="148" height="148" alt="AWL PHOTO">

... with:

<div id="overlay" style="position: absolute; top: 10px; left: 10px; z-index: 99;">
    <img src="../awlbannersmall2.jpg" width="148" height="148" alt="AWL PHOTO">
</div>

... changing the 'top' and 'left' values to position the <img> as desired.

If you would like to include a header in your web page above your gallery, try setting the gallery's height as an absolute pixel value rather than a percentage. Alternatively, there are instructions and an online demonstration for 'Using a Resizable Gallery with a Header' here which would allow you to have a header and gallery on the same web page with no scroll bars and the gallery would resize dynamically as the user changes the browser window size.

Steven Speirs
SimpleViewer Support Team

3 Reply by ashleyleonard (edited by ashleyleonard 2012-06-05 18:01:26)

  • From: Los Angeles, CA, US
  • Registered: 2008-05-01
  • Posts: 5

Re: wmode=transparent=fail

Thanks so much for your thorough response, Steven.  I am opting to use the Resizable Gallery with a Header, as you suggested.  I have downloaded the example embeds, but I see no instructions for what to do with it anywhere.

I'd like to use the Vertical Gallery with Header and Footer.  Looking at the folder contents, I'm uncertain how to apply the contents within the folder in Dreamweaver.  I've tried a bunch of variations based on what I saw in the online demos, but I am not getting it.  Am I not able to use the svBuilder if I use this option?

Some clarification on implementation would be greatly appreciated.  I'm also interested in knowing if this feature comes packaged with the Pro version.

Thanks again.

  • Registered: 2008-07-06
  • Posts: 6,334

Re: wmode=transparent=fail

I'd like to use the Vertical Gallery with Header and Footer.  Looking at the folder contents, I'm uncertain how to apply the contents within the folder in Dreamweaver.

If you would like to implement the vertical template with header and footer example for a single gallery, I have created a simplified template which you can download from here.
However, it may be easier to do the following manually than to try to integrate everything within Dreamweaver. Once everything is done, keep your 'vertical-template' folder as a self-contained entity and view the result by opening the 'vertical-template/index.html' file in a browser.

Create your own gallery using svBuilder and swap the contents of the 'vertical-template/gallery_folder/' folder from the zip file with the contents of your own gallery. You can then change the contents of the header and footer by editing the 'vertical-template/index.html' file (either in Dreamweaver or manually by opening the file in a plain text editor). Finally, you can set the heights for the header and footer in the 'vertical-template/sv.vertical.template.css' file.

I'm also interested in knowing if this feature comes packaged with the Pro version.

Embedding a SimpleViewer-Pro gallery is exactly the same as embedding a SimpleViewer-Standard gallery. There are no differences in this respect between SimpleViewer-Standard and SimpleViewer-Pro.

Steven Speirs
SimpleViewer Support Team
  • From: Los Angeles, CA, US
  • Registered: 2008-05-01
  • Posts: 5

Re: wmode=transparent=fail

Thank you, Steven, so much.  I am so very appreciative of your assistance.  Looking forward to getting my galleries up and running!