AkewataruAurora
08-30-2008, 01:37 PM
Could someone PLEASE help me?
I tried using this code on the new index page I have been working on for my website, but it is not working. The main menu is showing, but the sub-menus are not showing if I have my flash movie on the page.
I checked the code and I didn't see anything that looked like it was wrong, but this is the first time I have used css, and I am unfamiliar with it, so I am not sure what the problem is.
I have viewed it in both Firefox and IE and it doesn't work in either browser.
If someone could please look at the code on my page, tell me if I I have done something wrong, and post everything I need to change, I would greatly appreciate it. Please put the entire section of the code I need to change so I can see exactly where it goes.
Here is a link to the original code:
http://www.dynamicdrive.com/style/csslibrary/item/suckertree-menu-vertical/P230/
Here it the URL of my page:
http://reflectionsphotographybyroxanne.com/test-new.html
Here is the code for my page:
<html>
<head>
<title>Reflections Photography by Roxanne Davis Springfield Ohio</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta content="Reflections Photography" name="TITLE" />
<meta content="Reflections Photography by Roxanne Davis offers professional photography services of the highest quality. Please visit my website for many examples of my work, such as wedding photos, senior pictures, pet portraits, bands which I have done photography for, scenic and wildlife photos & more, some of which are available for purchase. You will also find information on how to contact me if you wish to hire me. Based in Springfield, Ohio." name="DESCRIPTION" />
<meta content="reflections photography, Springfield Ohio photos photo sharing nature scenic wildlife BLOOD print gallery galleries landscape Yellowstone national park mountain waterfall animal buffalo bison coyote elk mammoth hot spring canyon river picture Kiwamu Kaede Fu-ki music photography reflection reflections photographer Roxanne Davis professional photographer photograph portfolio image wedding portrait nature scenic wildlife concert live show band Queensryche D'espairsRay DespairsRay BLOOD DuelJewel Soundevice Japanese rock music jrock j-rock profile jhouserock animals musician Hizumi Zero Karyu Tsukasa Geoff Tate Michael Wilton Whip Eddie Jackson Scott Rockenfield Mike Stone Hayato Shun Natsuki Yuya Baru Val" name="KEYWORDS" />
<meta content="roxanne@reflectionsphotographybyroxanne.com" name="OWNER" />
<meta content="Roxanne Davis" name="AUTHOR" />
<meta http-equiv="EXPIRES" /><meta http-equiv="CHARSET" content="ISO-8859-1" />
<meta http-equiv="CONTENT-LANGUAGE" content="English" />
<meta http-equiv="VW96.OBJECT TYPE" content="photography" />
<meta content="General" name="RATING" />
<meta content="index,follow" name="ROBOTS" />
<meta content="4 weeks" name="REVISIT-AFTER" />
<STYLE type="text/css">
a:link {
color:#e2e2e2;
font-weight: none;
text-decoration: none
}
a:active {
color:#e2e2e2;
font-weight: none ;
text-decoration: none
}
a:visited {
color:#e2e2e2;
font-weight: none ;
text-decoration: none
}
a:hover {
color:#e2e2e2;
text-decoration: none;
font-weight:none ;
}</STYLE>
<style type="text/css">
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
.suckerdiv ul{
margin: 0;
padding: 0;
list-style-type: none;
width: 160px; /* Width of Menu Items */
border-bottom: 1px solid #e2e2e2;
}
.suckerdiv ul li{
position: relative;
}
/*Sub level menu items */
.suckerdiv ul li ul{
position: absolute;
width: 170px; /*sub menu width*/
top: 0;
visibility: hidden;
}
/* Sub level menu links style */
.suckerdiv ul li a{
display: block;
overflow: auto; /*force hasLayout in IE7 */
color: #e2e2e2;
text-decoration: none;
background: #000000;
padding: 1px 5px;
border: 1px solid #e2e2e2;
border-bottom: 0;
}
.suckerdiv ul li a:visited{
color: e2e2e2;
}
.suckerdiv ul li a:hover{
background-color: black;
}
.suckerdiv .subfolderstyle{
background: url(media/arrow-list.gif) no-repeat center right;
}
/* Holly Hack for IE \*/
* html .suckerdiv ul li { float: left; height: 1%; }
* html .suckerdiv ul li a { height: 1%; }
/* End */
</style>
<script type="text/javascript">
//SuckerTree Vertical Menu 1.1 (Nov 8th, 06)
//By Dynamic Drive: http://www.dynamicdrive.com/style/
var menuids=["suckertree1"] //Enter id(s) of SuckerTree UL menus, separated by commas
function buildsubmenus(){
for (var i=0; i<menuids.length; i++){
var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
for (var t=0; t<ultags.length; t++){
ultags[t].parentNode.getElementsByTagName("a")[0].className="subfolderstyle"
if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu
ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item
else //else if this is a sub level submenu (ul)
ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it
ultags[t].parentNode.onmouseover=function(){
this.getElementsByTagName("ul")[0].style.display="block"
}
ultags[t].parentNode.onmouseout=function(){
this.getElementsByTagName("ul")[0].style.display="none"
}
}
for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars
ultags[t].style.visibility="visible"
ultags[t].style.display="none"
}
}
}
if (window.addEventListener)
window.addEventListener("load", buildsubmenus, false)
else if (window.attachEvent)
window.attachEvent("onload", buildsubmenus)
</script>
</head>
<body bgcolor="#000000">
<table style="border-collapse: collapse; background-color: rgb(0, 0, 0)" summary="" align="center" border="0" bordercolor="#e2e2e2" cellpadding="0" cellspacing="0">
<tbody>
<tr valign="top">
<td width="1000">
<div align="center"></div>
<p align="center"><img alt="" title="" src="/graphics/Reflections_new_banner.jpg" height="" width="" /> </p>
<p> </p>
<table style="width: 100%; border-collapse: collapse" summary="" border="0" bordercolor="#e2e2e2" cellpadding="0" cellspacing="0">
<tbody>
<tr valign="top">
<td width="15%">
<p>
<br>
<br>
<br>
<br>
<div class="suckerdiv">
<ul id="suckertree1">
<li><a href="http://www.reflectionsphotographybyroxanne.com/galleries/Wedding_gallery_files/index.html">Wedding gallery</a></li>
<li><a href="#">Senior photos</a>
<ul>
<li><a href="http://www.reflectionsphotographybyroxanne.com/galleries/Senior_gallery_files/index.html">Senior gallery</a></li>
<li><a href="#">Special Senior graphics</a></li>
</ul>
</li>
<li><a href=" ">People & portraits gallery</a></li>
<li><a href=" ">Pets gallery</a></li>
<li><a href="#">Band photos</a>
<ul>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/DespairsRay_gallery_files/index.html">D'espairsRay</a></li>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/Queensryche_gallery_files/index.html">Queensr˙che</a></li>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/DuelJewel_gallery_files/index.html">DuelJewel</a></li>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/Love_Said_No_gallery_files/index.html">Love Said No</a></li>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/Soundevice_gallery_files/index.html">Soundevice</a></li>
</ul>
</li>
<li><a href="#">Fine Art galleries</a>
<ul>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/Scenic_gallery_files/index.html">Scenic gallery</a></li>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/Wildlife_gallery_files/index.htm">Wildlife gallery</a></li>
</ul>
</li>
<li><a href="#">Price Lists</a>
<ul>
<li><a href="http://reflectionsphotographybyroxanne.com/wedding_price_list.html">Wedding Price List</a></li>
<li><a href="#">Seniors Price List</a></li>
<li><a href="#">Portrait Price List</a></li>
<li><a href="#">Pet Portrait Price List</a></li>
</ul>
</li>
<li><a href="http://reflectionsphotographybyroxanne.com/profile.html">Photographer's Profile</a></li>
<li><a href="http://reflectionsphotographybyroxanne.com/links.html">Links</a></li>
</ul>
</div></p></td>
<td width="85%">
<p>
<div align="center"><center>
<body bgcolor="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="850" height="510">
<param name="movie" value="new_Reflections.swf">
<param name="quality" value="high">
<param name="bgcolor" value="#000000">
<embed name="new_Reflections" src="new_Reflections.swf" width="850" height="510" quality="high" bgcolor="#000000" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer">
</object></center></div>
</p></td></tr></tbody></table> </td></tr></tbody></table><br />
</body>
</html>
I tried using this code on the new index page I have been working on for my website, but it is not working. The main menu is showing, but the sub-menus are not showing if I have my flash movie on the page.
I checked the code and I didn't see anything that looked like it was wrong, but this is the first time I have used css, and I am unfamiliar with it, so I am not sure what the problem is.
I have viewed it in both Firefox and IE and it doesn't work in either browser.
If someone could please look at the code on my page, tell me if I I have done something wrong, and post everything I need to change, I would greatly appreciate it. Please put the entire section of the code I need to change so I can see exactly where it goes.
Here is a link to the original code:
http://www.dynamicdrive.com/style/csslibrary/item/suckertree-menu-vertical/P230/
Here it the URL of my page:
http://reflectionsphotographybyroxanne.com/test-new.html
Here is the code for my page:
<html>
<head>
<title>Reflections Photography by Roxanne Davis Springfield Ohio</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta content="Reflections Photography" name="TITLE" />
<meta content="Reflections Photography by Roxanne Davis offers professional photography services of the highest quality. Please visit my website for many examples of my work, such as wedding photos, senior pictures, pet portraits, bands which I have done photography for, scenic and wildlife photos & more, some of which are available for purchase. You will also find information on how to contact me if you wish to hire me. Based in Springfield, Ohio." name="DESCRIPTION" />
<meta content="reflections photography, Springfield Ohio photos photo sharing nature scenic wildlife BLOOD print gallery galleries landscape Yellowstone national park mountain waterfall animal buffalo bison coyote elk mammoth hot spring canyon river picture Kiwamu Kaede Fu-ki music photography reflection reflections photographer Roxanne Davis professional photographer photograph portfolio image wedding portrait nature scenic wildlife concert live show band Queensryche D'espairsRay DespairsRay BLOOD DuelJewel Soundevice Japanese rock music jrock j-rock profile jhouserock animals musician Hizumi Zero Karyu Tsukasa Geoff Tate Michael Wilton Whip Eddie Jackson Scott Rockenfield Mike Stone Hayato Shun Natsuki Yuya Baru Val" name="KEYWORDS" />
<meta content="roxanne@reflectionsphotographybyroxanne.com" name="OWNER" />
<meta content="Roxanne Davis" name="AUTHOR" />
<meta http-equiv="EXPIRES" /><meta http-equiv="CHARSET" content="ISO-8859-1" />
<meta http-equiv="CONTENT-LANGUAGE" content="English" />
<meta http-equiv="VW96.OBJECT TYPE" content="photography" />
<meta content="General" name="RATING" />
<meta content="index,follow" name="ROBOTS" />
<meta content="4 weeks" name="REVISIT-AFTER" />
<STYLE type="text/css">
a:link {
color:#e2e2e2;
font-weight: none;
text-decoration: none
}
a:active {
color:#e2e2e2;
font-weight: none ;
text-decoration: none
}
a:visited {
color:#e2e2e2;
font-weight: none ;
text-decoration: none
}
a:hover {
color:#e2e2e2;
text-decoration: none;
font-weight:none ;
}</STYLE>
<style type="text/css">
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */
.suckerdiv ul{
margin: 0;
padding: 0;
list-style-type: none;
width: 160px; /* Width of Menu Items */
border-bottom: 1px solid #e2e2e2;
}
.suckerdiv ul li{
position: relative;
}
/*Sub level menu items */
.suckerdiv ul li ul{
position: absolute;
width: 170px; /*sub menu width*/
top: 0;
visibility: hidden;
}
/* Sub level menu links style */
.suckerdiv ul li a{
display: block;
overflow: auto; /*force hasLayout in IE7 */
color: #e2e2e2;
text-decoration: none;
background: #000000;
padding: 1px 5px;
border: 1px solid #e2e2e2;
border-bottom: 0;
}
.suckerdiv ul li a:visited{
color: e2e2e2;
}
.suckerdiv ul li a:hover{
background-color: black;
}
.suckerdiv .subfolderstyle{
background: url(media/arrow-list.gif) no-repeat center right;
}
/* Holly Hack for IE \*/
* html .suckerdiv ul li { float: left; height: 1%; }
* html .suckerdiv ul li a { height: 1%; }
/* End */
</style>
<script type="text/javascript">
//SuckerTree Vertical Menu 1.1 (Nov 8th, 06)
//By Dynamic Drive: http://www.dynamicdrive.com/style/
var menuids=["suckertree1"] //Enter id(s) of SuckerTree UL menus, separated by commas
function buildsubmenus(){
for (var i=0; i<menuids.length; i++){
var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
for (var t=0; t<ultags.length; t++){
ultags[t].parentNode.getElementsByTagName("a")[0].className="subfolderstyle"
if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu
ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item
else //else if this is a sub level submenu (ul)
ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it
ultags[t].parentNode.onmouseover=function(){
this.getElementsByTagName("ul")[0].style.display="block"
}
ultags[t].parentNode.onmouseout=function(){
this.getElementsByTagName("ul")[0].style.display="none"
}
}
for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars
ultags[t].style.visibility="visible"
ultags[t].style.display="none"
}
}
}
if (window.addEventListener)
window.addEventListener("load", buildsubmenus, false)
else if (window.attachEvent)
window.attachEvent("onload", buildsubmenus)
</script>
</head>
<body bgcolor="#000000">
<table style="border-collapse: collapse; background-color: rgb(0, 0, 0)" summary="" align="center" border="0" bordercolor="#e2e2e2" cellpadding="0" cellspacing="0">
<tbody>
<tr valign="top">
<td width="1000">
<div align="center"></div>
<p align="center"><img alt="" title="" src="/graphics/Reflections_new_banner.jpg" height="" width="" /> </p>
<p> </p>
<table style="width: 100%; border-collapse: collapse" summary="" border="0" bordercolor="#e2e2e2" cellpadding="0" cellspacing="0">
<tbody>
<tr valign="top">
<td width="15%">
<p>
<br>
<br>
<br>
<br>
<div class="suckerdiv">
<ul id="suckertree1">
<li><a href="http://www.reflectionsphotographybyroxanne.com/galleries/Wedding_gallery_files/index.html">Wedding gallery</a></li>
<li><a href="#">Senior photos</a>
<ul>
<li><a href="http://www.reflectionsphotographybyroxanne.com/galleries/Senior_gallery_files/index.html">Senior gallery</a></li>
<li><a href="#">Special Senior graphics</a></li>
</ul>
</li>
<li><a href=" ">People & portraits gallery</a></li>
<li><a href=" ">Pets gallery</a></li>
<li><a href="#">Band photos</a>
<ul>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/DespairsRay_gallery_files/index.html">D'espairsRay</a></li>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/Queensryche_gallery_files/index.html">Queensr˙che</a></li>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/DuelJewel_gallery_files/index.html">DuelJewel</a></li>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/Love_Said_No_gallery_files/index.html">Love Said No</a></li>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/Soundevice_gallery_files/index.html">Soundevice</a></li>
</ul>
</li>
<li><a href="#">Fine Art galleries</a>
<ul>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/Scenic_gallery_files/index.html">Scenic gallery</a></li>
<li><a href="http://reflectionsphotographybyroxanne.com/galleries/Wildlife_gallery_files/index.htm">Wildlife gallery</a></li>
</ul>
</li>
<li><a href="#">Price Lists</a>
<ul>
<li><a href="http://reflectionsphotographybyroxanne.com/wedding_price_list.html">Wedding Price List</a></li>
<li><a href="#">Seniors Price List</a></li>
<li><a href="#">Portrait Price List</a></li>
<li><a href="#">Pet Portrait Price List</a></li>
</ul>
</li>
<li><a href="http://reflectionsphotographybyroxanne.com/profile.html">Photographer's Profile</a></li>
<li><a href="http://reflectionsphotographybyroxanne.com/links.html">Links</a></li>
</ul>
</div></p></td>
<td width="85%">
<p>
<div align="center"><center>
<body bgcolor="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="850" height="510">
<param name="movie" value="new_Reflections.swf">
<param name="quality" value="high">
<param name="bgcolor" value="#000000">
<embed name="new_Reflections" src="new_Reflections.swf" width="850" height="510" quality="high" bgcolor="#000000" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer">
</object></center></div>
</p></td></tr></tbody></table> </td></tr></tbody></table><br />
</body>
</html>