PDA

View Full Version : I need help on the Omni Slide Menu!!!!



Zapboy27
05-31-2007, 02:43 PM
I need to change the color of the menu sticking out saying, "Left Menu" and "Right Menu" a bit to yellow and the text there to maroon. I need help heres my html code, please post it back.

<!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" lang="en" xml:lang="en">
<head>
<script LANGUAGE="JavaScript">

</script>

<title>Dynamic Drive DHTML Scripts- Omni Slide Menu demo</title>
<style type="text/css">
/*Menu Links*/

/*NOTE: anything not specified for the #(menu id's) a selector and its pseudo classes
may be inherited in some browsers from other 'a' element styles (if any) on the page*/

#menu1 a {color:black;background-color:white;text-decoration:none;text-indent:1ex;}
#menu1 a:active {color:black;text-decoration:none;}
#menu1 a:hover {color:black;background-color:#FFFF99}
#menu1 a:visited {color:black;text-decoration:none;}

#menu2 a {color:navy;background-color:white;text-decoration:none;text-indent:1ex;}
#menu2 a:active {color:blue;text-decoration:none;}
#menu2 a:visited {color:blue;text-decoration:none;}
#menu2 a:hover {color:navy;background-color:#f0fea8}

#menu3 a { /*Menu3 Links*/
color:black;
background-color:white;
text-decoration:none;
text-indent:1ex;
}
#menu3 a:hover {
color:black;background-color:#FFFF99;
}
#menu3 a:active {color:black;text-decoration:none;}
#menu3 a:visited {color:black;text-decoration:none;}


/*End Menu Links*/
</style>
<script src="mmenu.js" type="text/javascript"></script>
<script src="menuItems.js" type="text/javascript">

/***********************************************
* Omni Slide Menu script - John Davenport Scheuer: http://home.comcast.net/~jscheuer1/
* very freely adapted from Dynamic-FX Slide-In Menu (v 6.5) script- by maXimus
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full original source code
***********************************************/

</script>

</head>

<body bgcolor="#800000" text="#D9D900">

<div align="center">
<center>

<table border="1" bgcolor="#800000" width="754" bordercolordark="#D9D900" bordercolorlight="#D9D900" height="749">
<tr>
<td width="676" height="90" align="center" colspan="2">
<p align="center"><b><font size="7">Bent Elementary</font></b><p align="center"><b><strong><font size="3"><!--webbot
bot="HitCounter" u-custom i-digits="0" i-image="0"
PREVIEW="&lt;strong&gt;[Hit Counter]&lt;/strong&gt;" i-resetvalue="0" startspan --><img src="../../_vti_bin/fpcount.exe/02706/?Page=assignments/Bent/default.htm|Image=0" alt="Hit Counter"><!--webbot bot="HitCounter" endspan i-checksum="29125" -->
</font><font size="4">people have visited this website</font></strong></b></td>
</tr>
<tr>
<script type="text/javascript">


</script>

<td>

<p style="font: normal 11px Arial">&nbsp;<script type="text/javascript">

// Flexible Image Slideshow- By JavaScriptKit.com (http://www.javascriptkit.com)
// For this and over 400+ free scripts, visit JavaScript Kit- http://www.javascriptkit.com/
// This notice must stay intact for use

var ultimateshow=new Array()

//ultimateshow[x]=["path to image", "OPTIONAL link for image", "OPTIONAL link target"]

ultimateshow[0]=['dinosour.gif', '', '']
ultimateshow[1]=['crow.gif', 'http://www.dynamicdrive.com', '_new']
ultimateshow[2]=['pig.gif', 'http://www.codingforums.com', '']

//configure the below 3 variables to set the dimension/background color of the slideshow

var slidewidth="300px" //set to width of LARGEST image in your slideshow
var slideheight="261px" //set to height of LARGEST iamge in your slideshow
var slidecycles="3" //number of cycles before slideshow stops (ie: "2" or "continous")
var randomorder="no" //randomize the order in which images are displayed? "yes" or "no"
var preloadimages="yes" //preload images? "yes" or "no"
var slidebgcolor='white'

//configure the below variable to determine the delay between image rotations (in miliseconds)
var slidedelay=3000

////Do not edit pass this line////////////////

var ie=document.all
var dom=document.getElementById
var curcycle=0

if (preloadimages=="yes"){
for (i=0;i<ultimateshow.length;i++){
var cacheimage=new Image()
cacheimage.src=ultimateshow[i][0]
}
}

var currentslide=0

function randomize(targetarray){
ultimateshowCopy=new Array()
var the_one
var z=0
while (z<targetarray.length){
the_one=Math.floor(Math.random()*targetarray.length)
if (targetarray[the_one]!="_selected!"){
ultimateshowCopy[z]=targetarray[the_one]
targetarray[the_one]="_selected!"
z++
}
}
}

if (randomorder=="yes")
randomize(ultimateshow)
else
ultimateshowCopy=ultimateshow

function rotateimages(){
curcycle=(currentslide==0)? curcycle+1 : curcycle
ultcontainer='<center>'
if (ultimateshowCopy[currentslide][1]!="")
ultcontainer+='<a href="'+ultimateshowCopy[currentslide][1]+'" target="'+ultimateshowCopy[currentslide][2]+'">'
ultcontainer+='<img src="'+ultimateshowCopy[currentslide][0]+'" border="0">'
if (ultimateshowCopy[currentslide][1]!="")
ultcontainer+='</a>'
ultcontainer+='</center>'
if (ie||dom)
crossrotateobj.innerHTML=ultcontainer
if (currentslide==ultimateshow.length-1) currentslide=0
else currentslide++
if (curcycle==parseInt(slidecycles) && currentslide==0)
return
setTimeout("rotateimages()",slidedelay)
}

if (ie||dom)
document.write('<div id="slidedom" style="width:'+slidewidth+';height:'+slideheight+'; background-color:'+slidebgcolor+'"></div>')

function start_slider(){
crossrotateobj=dom? document.getElementById("slidedom") : document.all.slidedom
rotateimages()
}

if (ie||dom)
window.onload=start_slider

</script>

<p style="font: normal 11px Arial"></p> <td width="428" height="229" align="center">
<p align="center"></p>
</td>
<td width="324" height="229" align="center">
<p align="center"><img border="0" src="images/Bentschoollogo.jpg" width="321" height="240"></p>
</td>
</tr>
<tr>
<td width="428" height="69" align="center">
<p align="center"><b>To get to other information put your mouse cursor
over the side menus and your options will show.</b></p>
</td>
<td width="324" height="412" align="center" rowspan="6">
<p style="LINE-HEIGHT: 100%" align="center"><b><font color="#ffff00" size="2">&nbsp;</font><font color="#D9D900"><font size="4">
Principal:</font><font size="2">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </font><font size="4"><a href="mailto:armendarizd@district87.org">Debbie
Armendariz</a>&nbsp;</font></font></b>
<p style="LINE-HEIGHT: 100%" align="center"><tt><b><font face="Arial" color="#D9D900" size="4">904
North Roosevelt Avenue</font></b></tt>
<p style="LINE-HEIGHT: 100%" align="center"><tt><b><font face="Arial" color="#D9D900" size="4">Bloomington,
Illinois 61701</font></b></tt>
<p style="LINE-HEIGHT: 100%" align="center"><tt><b><font face="Arial" color="#D9D900" size="4">(309)
828 - 4315 &amp; Fax (309) 828 - 3587</font></b></tt></p>
<p align="center">&nbsp;</p>
</td>
</tr>
<tr>
<td width="428" height="69" align="center">
&nbsp;
</td>
</tr>
<tr>
<td width="428" height="69" align="center">
&nbsp;
</td>
</tr>
<tr>
<td width="428" height="69" align="center">
&nbsp;
</td>
</tr>
<tr>
<td width="428" height="68" align="center">
&nbsp;
</td>
</tr>
<tr>
<td width="428" height="68" align="center">
&nbsp;
</td>
</tr>
</table>
</center>
</div>
</body>
</html>

___________________________________________________________________

ALso there is an attachment with a pic of the site>

Please help Thank you
:confused:

jscheuer1
06-01-2007, 05:13 AM
Go back and re-read the demo page. Those things can be set for each menu in the configuration file (menuItems.js) using the various optional properties.

Also:

Warning: Please include a link to the DD script in question in your post. See this thread (http://www.dynamicdrive.com/forums/showthread.php?t=6) for the proper posting format when asking a question.