I've created a photo album slideshow using Indesign CS6 and exporting to a swf file. I've inserted that in a one-page website using Dreamweaver CS4 (no external style sheet because just a single page). The problem was that if the window was too small for the photo album, there was no way of scrolling because neither scrollbar was showing. I then inserted the overflow: scroll; code which produced scrollbars. However, there is nothing to slide on the vertical one and the horizontal one has a slider, but it does nothing.
I would love someone to give a clue... nothing I've tried from all the forums has helped. Link to test page so you can see what I mean: http://www.e-compass.co.nz/test/test3.html
My code:
<!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 {
font: 100% Verdana, Arial, Helvetica, sans-serif;
background: #46443E;
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #000000;
overflow: scroll;
}
.oneColFixCtr #container {
width: 900px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
background: #FFFFFF;
margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
border: 1px solid #000000;
text-align: left; /* this overrides the text-align: center on the body element. */
}
.oneColFixCtr #mainContent {
padding: 0 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
background-color: #373028;
position: fixed;
width: 900px;
}
.shahtooshtext {
color: #e1dbca;
font-size: 10px;
font-weight: bold;
}
A {
text-decoration:none;
color:#e1dbca;
}
A:visited {
text-decoration:none;
color:#e1dbca;
}
A:active {
text-decoration:none;
color:#e1dbca;
}
A:hover {
text-decoration:underline;
}
#floater {float:left; height:50%; margin-bottom:-120px;}
#content {clear:both; height:240px; position:relative;}
-->
</style>
<script src="../Scripts/swfobject_modified.js" type="text/javascript"></script>
</head>
<body class="oneColFixCtr">
<div id="container">
<div id="floater"></div>
<div id="mainContent"><table width="900" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="675"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="900" height="675" id="FlashID" title="Use corners to turn pages. Click HOME to return to start.">
<param name="movie" value="slideshow15.swf" />
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="swfversion" value="6.0.65.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" />
<!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="slideshow15.swf" width="900" height="675">
<!--<![endif]-->
<param name="quality" value="high" />
<param name="wmode" value="opaque" />
<param name="swfversion" value="6.0.65.0" />
<param name="expressinstall" value="../Scripts/expressInstall.swf" />
<!-- 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.g if" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
</div>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object></td>
</tr>
<tr>
<td align="center" bgcolor="#46443E"><p align="center" class="shahtooshtext"><a href="test3.html">HOME<br />
</a></p><p><img src="copyright_03.jpg" width="140" height="15" alt="Copyright" /></p></td>
</tr>
</table>
<!-- end #mainContent -->
</div>
<!-- end #container --></div>
<script type="text/javascript">
<!--
swfobject.registerObject("FlashID");
swfobject.registerObject("FlashID");
//-->
</script>
</body>
</html>
