You are not logged in. Please login or register.
SimpleViewer Forum → SimpleViewer-Pro v2 → Gallery not resizing in HTML page
When using SimpleViewer alone the gallery automatically resizes to any resolution monitor. My Dreamweaver HTML pages without the gallery inserted resize automatically as well. However, once I insert the SimpleViewer Gallery into the HTML web page the gallery no longer resizes. Is there a way to have the gallery continue to resize automatically?
Your issue probably has to do with either the embed code you are using or your CSS, make sure you are not giving the flash or the div you embed it into a static size.
Mike,
I have been trying everything I can think of to resolve this resizing issue. I have created plain HTML pages, pages with tables and a page with an iFrame, but none seem to achieve what I was asking about. I am keeping everything in the code as percentages- not fixed sizes, but still no luck.
As I look at 4-samples on your web page (http://www.simpleviewer.net/simpleviewer/pro/) I notice that the two that are inserted into HTML pages do not resize and the other two not inserted into HTML do. I just want to confirm that Simple Viewer Pro can be inserted into a HTML page and still be able to auto adjust to different resolutions.
Do you possibly have a sample that is inserted into a HTML page that you can direct me to so I can see some code and maybe figure out where I am going wrong? I'm assuming I am doing something wrong, but I cannot figure out what it is.
Thanks, I appreciate your help!
Have you taken a look at the HTML examples that come with the pro download? Is the page you are having trouble with online?
You can view it at: http://www.justwhatipictured.com. I appreciate any help you can give. As I said, I have tried many different ways of approaching this and none have been successful once it gets embedded with HTML. Thanks.
Your HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
background-color: #000;
}
-->
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
<script type="text/javascript">
var flashvars = {};
flashvars.galleryURL = "gallery.xml";
var params = {};
params.bgcolor = "000000";
params.allowfullscreen = true;
params.allowscriptaccess = "always";
swfobject.embedSWF("simpleviewer.swf", "flashContent", "100%", "100%", "9.0.124", false, flashvars, params);
</script>
</head>
<body>
<div id="flashContent">SimpleViewer requires JavaScript and the Flash Player. <a href="http://www.adobe.com/go/getflashplayer/">Get Flash.</a></div>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="600" id="FlashID" title="gallery">
<param name="movie" value="arch-gallery/simpleviewer.swf" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<param name="swfversion" value="9.0.45.0" />
<!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
<param name="expressinstall" value="Scripts/expressInstall.swf" />
<param name="allowFullScreen" value="true" />
<param name="flashVars" value="baseURL=arch-gallery/" />
<!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="arch-gallery/simpleviewer.swf" width="800" height="600">
<!--<![endif]-->
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<param name="swfversion" value="9.0.45.0" />
<param name="expressinstall" value="Scripts/expressInstall.swf" />
<param name="allowFullScreen" value="true" />
<param name="flashVars" value="baseURL=arch-gallery/" />
<!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
<div>
<h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
<p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player"/></a></p>
</div>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</p>
<script type="text/javascript">
<!--
swfobject.registerObject("FlashID");
//-->
</script>
</body>
</html>You shouldn't be using both SWFObject and the object embed method. I would suggest removing the object embed code listed below. In addition to conflicts between SWFObject and the object embed method, your object embed method is using a fixed height and width.
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="600" id="FlashID" title="gallery">
<param name="movie" value="arch-gallery/simpleviewer.swf" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<param name="swfversion" value="9.0.45.0" />
<!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
<param name="expressinstall" value="Scripts/expressInstall.swf" />
<param name="allowFullScreen" value="true" />
<param name="flashVars" value="baseURL=arch-gallery/" />
<!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="arch-gallery/simpleviewer.swf" width="800" height="600">
<!--<![endif]-->
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<param name="swfversion" value="9.0.45.0" />
<param name="expressinstall" value="Scripts/expressInstall.swf" />
<param name="allowFullScreen" value="true" />
<param name="flashVars" value="baseURL=arch-gallery/" />
<!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
<div>
<h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
<p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player"/></a></p>
</div>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>You also have 2 SWFObject JavaScript file, you need to choose one and get rid of the other.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>I have had a really tough time getting things to work properly and with one thing leading to another to remedy that I ended up with the code overlapping in areas as I tried the SimpleViewer Embedding Guide using Dreamweaver then Java Script Embed and the code that was generated with the SV Builder.
I see where the embedding guide using Dreamweaver did insert fixed dimensions. However, I am unclear as how much of that code to remove. I tried a few things - none of which worked when it came to the auto resizing. Please indicate more specifically (line to line) what needs to come out to eliminate the conflict.
I put the page back up without one of the SWFObject JavaScript file lines. The page is now at: http://www.justwhatipictured.com/untitled-9.html.
Thanks again!
Mike-
I went back to square one and used the Java Embed and have it working; sort of. I placed it at: http://www.justwhatipictured.com/untitled-10.html.
Two problems. The large image resizes, but the thumbnails do not. The other thing is anytime I place anything else in the HTML, such as a logo or Nav buttons, it causes the resizing to get messed up again. An example is at: http://www.justwhatipictured.com/untitled-11.html.
Is it possible to have the other HTML elements combined with the flash and not lose the resizing functionality?
The large image resizes, but the thumbnails do not.
The thumbnails do not resize.
The other thing is anytime I place anything else in the HTML, such as a logo or Nav buttons, it causes the resizing to get messed up again.
untitled-11.html is resizing for me, what browser/OS are you using?
I tested http://www.justwhatipictured.com/untitled-11.html in Firefox 3.63, IE 8, Chrome and Safari. In all of them the thumbnails are cut off on the bottom of the page. Then as the browser is resized (even slightly) the thumbs get lost all together.
In all of them the thumbnails are cut off on the bottom of the page. Then as the browser is resized (even slightly) the thumbs get lost all together.
Try setting overflow:hidden; to overflow:auto;
My ultimate goal is to have no scroll bars and have the gallery resize to different monitor resolutions automatically. If the thumbnails will not resize then is there is a way to have a logo and navigation menu for other pages appear on the gallery page? This way viewers can go from one of the site's pages to another without it appearing hap hazard.
Use position absolute to position your logo and menu with CSS, so that they do not bumping the flash down. You may also have to set the flash to transparent, so that it does not cover the image or menu.
SimpleViewer Forum → SimpleViewer-Pro v2 → Gallery not resizing in HTML page
Powered by PunBB, supported by Informer Technologies, Inc.
Currently installed 5 official extensions. Copyright © 2003–2009 PunBB.