PDA

View Full Version : Resolved chrome dropdown/slashdot conflict



valerie
01-10-2008, 04:16 AM
It's probably very simple if one knows what one is doing, but eek! I'm new to javascript...
I want to use the chrome dropdown menu at top of page and slashdot menu on the left:

http://www.dynamicdrive.com/dynamicindex1/chrome/index.htm

http://www.dynamicdrive.com/dynamicindex1/slashdot.htm

I had the chrome menu working, but once I add slashdot, the chrome menu display is wrong. I moved both script tags from head to body, made no difference, then changed the window.onload function to body.onload in slashdot, that messed slashdot up as well...so I put everything back into head, just fidgeting, I suppose, a
proper amateur. Don't see an .onload function for chrome menu...I read somewhere that one should use body.onload for both functions separated with semicolon, but how exactly?...

So here's my html, simplified, I threw in slashdot, without editing it's content, just trying to get the page to work first:


<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta http-equiv="Content-Language" content="en-gb">
<meta http-equiv="keywords" content="vintage fashion,retro-diva,retro,vintage,fashion,">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>Retro-Diva.com - Vintage Fashion&nbsp;&nbsp; ***&nbsp;&nbsp; Are You a
Diva?</title>







<link rel="stylesheet" type="text/css" href="chrometheme/chromestyle7.css" />

<script type="text/javascript" src="chromejs/chrome.js">

/***********************************************
* Chrome CSS Drop Down Menu- Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>






<link rel="stylesheet" type="text/css" href="sdmenu/sdmenu.css" />
<script type="text/javascript" src="sdmenu/sdmenu.js">
/***********************************************
* Slashdot Menu script- By DimX
* Submitted to Dynamic Drive DHTML code library: http://www.dynamicdrive.com
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
</script>
<script type="text/javascript">

// <![CDATA[
var myMenu;
window.onload = function() {
myMenu = new SDMenu("my_menu");
myMenu.init();
};
// ]]>
</script>







</head>

<body bgcolor="#FFFFCC" link="#FF6699" alink="#FF00FF" vlink="#FF3399">






<div align="left">
<table border="0" width="1100" height="100" bordercolor="#FFE699" cellspacing="0" cellpadding="0" bordercolorlight="#FFE699" bordercolordark="#FFE699">
<tr>
<td width="1100" height="100"><img src="image8.gif" width="400" height="100"><img border="0" src="DSCN0529sa.JPG" width="133" height="100"> <img border="0" src="DSCN0517sb.JPG" width="75" height="100"> </td></tr>
</table>

</div>


<div align="left">
<table border="2" width="1100" height="32" bordercolor="#FFCCCC" cellspacing="0" cellpadding="0" bordercolorlight="#FFCCCC" bordercolordark="#FFCCCC" bgcolor="#FFE699">
<tr>
<td width="1100" height="32" bgcolor="#FFCCCC" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FFCCCC">




<p align="left">

<div class="chromestyle" id="chromemenu">
<ul>
<li><a href="index.html">home</a></li>
<li><a href="about.html">about us</a></li>
<li><a href="policy.html">our policy</a></li>



<li><a href="#" rel="dropmenu1">items for sale</a></li>
<li><a href="#" rel="dropmenu2">Divas photo album</a></li>
<li><a href="#" rel="dropmenu3">useful tips</a></li>


<li><a href="archives.html">fashion archives</a></li>
<li><a href="shops.html">our local shops</a></li>
<li><a href="sell.html">sell to us</a></li>
<li><a href="contact.html">contact us</a></li>


</ul>
</div>


<!--1st drop down menu -->
<div id="dropmenu1" class="dropmenudiv" style="width: 150px;">
<a href="categories.html">Categories</a>
<a href="occasion.html">Occasion</a>
<a href="timeline.html">Timeline</a>
<a href="style.html">Styles</a>
</div>


<!--2nd drop down menu -->
<div id="dropmenu2" class="dropmenudiv" style="width: 150px;">
<a href="you.html">You as a Diva</a>
<a href="hollywood.html">Hollywood Divas</a>
<a href="glamour.html">Just Glamour</a>
</div>

<!--3rd drop down menu -->
<div id="dropmenu3" class="dropmenudiv" style="width: 150px;">
<a href="care.html">Care Tips</a>
<a href="restore.html">Restoration</a>
<a href="materials.html">Materials</a>
</div>


<script type="text/javascript">

cssdropdown.startchrome("chromemenu")

</script>


</td>
</tr>
</table>
</div>




<div align="left">
<table border="1" width="1100" height="800" bgcolor="#FFE699" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FF6699">
<tr>
<td width="180" height="800" bgcolor="#FFE699" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FF6699">



<div style="float: left" id="my_menu" class="sdmenu">
<div>
<span>Online Tools</span>
<a href="http://tools.dynamicdrive.com/imageoptimizer/">Image Optimizer</a>
<a href="http://tools.dynamicdrive.com/favicon/">FavIcon Generator</a>
<a href="http://www.dynamicdrive.com/emailriddler/">Email Riddler</a>
<a href="http://tools.dynamicdrive.com/password/">htaccess Password</a>
<a href="http://tools.dynamicdrive.com/gradient/">Gradient Image</a>
<a href="http://tools.dynamicdrive.com/button/">Button Maker</a>
</div>
<div>
<span>Support Us</span>
<a href="http://www.dynamicdrive.com/recommendit/">Recommend Us</a>
<a href="http://www.dynamicdrive.com/link.htm">Link to Us</a>
<a href="http://www.dynamicdrive.com/resources/">Web Resources</a>
</div>
<div class="collapsed">
<span>Partners</span>
<a href="http://www.javascriptkit.com">JavaScript Kit</a>
<a href="http://www.cssdrive.com">CSS Drive</a>
<a href="http://www.codingforums.com">CodingForums</a>
<a href="http://www.dynamicdrive.com/style/">CSS Examples</a>
</div>
<div>
<span>Test Current</span>
<a href="?foo=bar">Current or not</a>
<a href="./">Current or not</a>
<a href="index.html">Current or not</a>
<a href="index.html?query">Current or not</a>
</div>
</div>






</td>


<td width="340" height="800" bgcolor="#FFFFFF" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FF6699" valign="top">&nbsp;
<div align="center">
<center>
<table border="1" width="340" cellspacing="0" bgcolor="#FFFFCC" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FF6699" cellpadding="2">
<tr>
<td width="340">
<h2 align="center"><font color="#FF3399"><b>The
Blurb</b></font></h2>
<p align="left"><b><font color="#FF3399">VINTAGE</font></b> is
the <b> <font color="#FF3399"> LATEST</font></b> rage, </td>
</tr>
</table>
</center>
</div>
<p align="left">&nbsp;<p align="left">&nbsp;<p align="left">&nbsp;
</td>



<td width="410" height="800" bgcolor="#FFE699" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FF6699" valign="top">
<br><p align="center"><font color="#FF6699"><b>Are YOU a Retro-Diva? Get out of the
closet!</b></font></p><img border="0" src="DSCN0500ma.JPG" width="400" height="520">
</td>



<td width="180" height="800" bgcolor="#FFFFFF" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FF6699">&nbsp;</td>

</tr>
</table>
</div>


</body>

</html>



If anyone can help, it would be REALLY appreciated! :)

valerie

ddadmin
01-10-2008, 05:46 AM
Actually, there shouldn't be any conflicts with onload with these two scripts, as Chrome menu doesn't even use this event handler. I just tried creating a blank page with both Chrome Menu and Slashdot menu on it, and both seem to run fine. Please post a link to the page on your site that contains the problematic script so we can check it out.

valerie
01-10-2008, 12:22 PM
got it working, just needed to sleep on it...sorry to waist your time...:)

Diogo Guerreiro
06-20-2009, 04:42 PM
It's probably very simple if one knows what one is doing, but eek! I'm new to javascript...
I want to use the chrome dropdown menu at top of page and slashdot menu on the left:

http://www.dynamicdrive.com/dynamicindex1/chrome/index.htm

http://www.dynamicdrive.com/dynamicindex1/slashdot.htm

I had the chrome menu working, but once I add slashdot, the chrome menu display is wrong. I moved both script tags from head to body, made no difference, then changed the window.onload function to body.onload in slashdot, that messed slashdot up as well...so I put everything back into head, just fidgeting, I suppose, a . Don't see an .onload function for chrome menu...I read somewhere that one should use body.onload for both functions separated with semicolon, but how exactly?...

So here's my html, simplified, I threw in slashdot, without editing it's content, just trying to get the page to work first:


<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta http-equiv="Content-Language" content="en-gb">
<meta http-equiv="keywords" content="vintage fashion,retro-diva,retro,vintage,fashion,">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>Retro-Diva.com - Vintage Fashion&nbsp;&nbsp; ***&nbsp;&nbsp; Are You a
Diva?</title>







<link rel="stylesheet" type="text/css" href="chrometheme/chromestyle7.css" />

<script type="text/javascript" src="chromejs/chrome.js">

/***********************************************
* Chrome CSS Drop Down Menu- Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>






<link rel="stylesheet" type="text/css" href="sdmenu/sdmenu.css" />
<script type="text/javascript" src="sdmenu/sdmenu.js">
/***********************************************
* Slashdot Menu script- By DimX
* Submitted to Dynamic Drive DHTML code library: http://www.dynamicdrive.com
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
</script>
<script type="text/javascript">

// <![CDATA[
var myMenu;
window.onload = function() {
myMenu = new SDMenu("my_menu");
myMenu.init();
};
// ]]>
</script>







</head>

<body bgcolor="#FFFFCC" link="#FF6699" alink="#FF00FF" vlink="#FF3399">






<div align="left">
<table border="0" width="1100" height="100" bordercolor="#FFE699" cellspacing="0" cellpadding="0" bordercolorlight="#FFE699" bordercolordark="#FFE699">
<tr>
<td width="1100" height="100"><img src="image8.gif" width="400" height="100"><img border="0" src="DSCN0529sa.JPG" width="133" height="100"> <img border="0" src="DSCN0517sb.JPG" width="75" height="100"> </td></tr>
</table>

</div>


<div align="left">
<table border="2" width="1100" height="32" bordercolor="#FFCCCC" cellspacing="0" cellpadding="0" bordercolorlight="#FFCCCC" bordercolordark="#FFCCCC" bgcolor="#FFE699">
<tr>
<td width="1100" height="32" bgcolor="#FFCCCC" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FFCCCC">




<p align="left">

<div class="chromestyle" id="chromemenu">
<ul>
<li><a href="index.html">home</a></li>
<li><a href="about.html">about us</a></li>
<li><a href="policy.html">our policy</a></li>



<li><a href="#" rel="dropmenu1">items for sale</a></li>
<li><a href="#" rel="dropmenu2">Divas photo album</a></li>
<li><a href="#" rel="dropmenu3">useful tips</a></li>


<li><a href="archives.html">fashion archives</a></li>
<li><a href="shops.html">our local shops</a></li>
<li><a href="sell.html">sell to us</a></li>
<li><a href="contact.html">contact us</a></li>


</ul>
</div>


<!--1st drop down menu -->
<div id="dropmenu1" class="dropmenudiv" style="width: 150px;">
<a href="categories.html">Categories</a>
<a href="occasion.html">Occasion</a>
<a href="timeline.html">Timeline</a>
<a href="style.html">Styles</a>
</div>


<!--2nd drop down menu -->
<div id="dropmenu2" class="dropmenudiv" style="width: 150px;">
<a href="you.html">You as a Diva</a>
<a href="hollywood.html">Hollywood Divas</a>
<a href="glamour.html">Just Glamour</a>
</div>

<!--3rd drop down menu -->
<div id="dropmenu3" class="dropmenudiv" style="width: 150px;">
<a href="care.html">Care Tips</a>
<a href="restore.html">Restoration</a>
<a href="materials.html">Materials</a>
</div>


<script type="text/javascript">

cssdropdown.startchrome("chromemenu")

</script>


</td>
</tr>
</table>
</div>




<div align="left">
<table border="1" width="1100" height="800" bgcolor="#FFE699" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FF6699">
<tr>
<td width="180" height="800" bgcolor="#FFE699" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FF6699">



<div style="float: left" id="my_menu" class="sdmenu">
<div>
<span>Online Tools</span>
<a href="http://tools.dynamicdrive.com/imageoptimizer/">Image Optimizer</a>
<a href="http://tools.dynamicdrive.com/favicon/">FavIcon Generator</a>
<a href="http://www.dynamicdrive.com/emailriddler/">Email Riddler</a>
<a href="http://tools.dynamicdrive.com/password/">htaccess Password</a>
<a href="http://tools.dynamicdrive.com/gradient/">Gradient Image</a>
<a href="http://tools.dynamicdrive.com/button/">Button Maker</a>
</div>
<div>
<span>Support Us</span>
<a href="http://www.dynamicdrive.com/recommendit/">Recommend Us</a>
<a href="http://www.dynamicdrive.com/link.htm">Link to Us</a>
<a href="http://www.dynamicdrive.com/resources/">Web Resources</a>
</div>
<div class="collapsed">
<span>Partners</span>
<a href="http://www.javascriptkit.com">JavaScript Kit</a>
<a href="http://www.cssdrive.com">CSS Drive</a>
<a href="http://www.codingforums.com">CodingForums</a>
<a href="http://www.dynamicdrive.com/style/">CSS Examples</a>
</div>
<div>
<span>Test Current</span>
<a href="?foo=bar">Current or not</a>
<a href="./">Current or not</a>
<a href="index.html">Current or not</a>
<a href="index.html?query">Current or not</a>
</div>
</div>






</td>


<td width="340" height="800" bgcolor="#FFFFFF" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FF6699" valign="top">&nbsp;
<div align="center">
<center>
<table border="1" width="340" cellspacing="0" bgcolor="#FFFFCC" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FF6699" cellpadding="2">
<tr>
<td width="340">
<h2 align="center"><font color="#FF3399"><b>The
Blurb</b></font></h2>
<p align="left"><b><font color="#FF3399">VINTAGE</font></b> is
the <b> <font color="#FF3399"> LATEST</font></b> rage, </td>
</tr>
</table>
</center>
</div>
<p align="left">&nbsp;<p align="left">&nbsp;<p align="left">&nbsp;
</td>



<td width="410" height="800" bgcolor="#FFE699" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FF6699" valign="top">
<br><p align="center"><font color="#FF6699"><b>Are YOU a Retro-Diva? Get out of the
closet!</b></font></p><img border="0" src="DSCN0500ma.JPG" width="400" height="520">
</td>



<td width="180" height="800" bgcolor="#FFFFFF" bordercolor="#FFCCCC" bordercolorlight="#FFCCCC" bordercolordark="#FF6699">&nbsp;</td>

</tr>
</table>
</div>


</body>

</html>



If anyone can help, it would be REALLY appreciated! :)

valerie
Hi.
My menu does not work in google chrome... I can help please.

http://www.fotografia-dg.com