Is there a way to make my css drop down to appear over the javascript slide show? [url]http://tsocommunication.ca/test/isaac/index.php
Currently the drop down is hidden behind it, could anyone help me out?
I used this tutorial to make the slideshow:
[url]http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm
PS Wasn’t sure if I should have posted this in the javascript or css forum, sorry if I posted in the wrong one.
CSS menu code:
[CODE].menu{
border:0px;
margin:0px;
padding:0px;
font-family: Verdana;
font-size:13px;
font-weight:bold;
width: 850px;
height: 35px;
}
.menu ul{
background:#333333;
height:35px;
list-style:none;
margin:0;
padding:0;
}
.menu li{
float:left;
padding:0px;
}
.menu li a{
background:#333333 url(“images/seperator.gif”) bottom right no-repeat;
color:#cccccc;
display:block;
font-weight:normal;
line-height:35px;
margin:0px;
padding:0px 25px;
text-align:center;
text-decoration:none;
}
.menu li a:hover, .menu ul li:hover a{
background: #00549E url(“images/hover.gif”) bottom center no-repeat;
color:#FFFFFF;
text-decoration:none;
}
.menu li ul{
background:#333333;
display:none;
height:auto;
padding:0px;
margin:0px;
border:0px;
position:absolute;
width:225px;
z-index:200;
/*top:1em;
/*left:0;*/
}
.menu li:hover ul{
display:block;
}
.menu li li {
background:url(‘images/sub_sep.gif’) bottom left no-repeat;
display:block;
float:none;
margin:0px;
padding:0px;
width:225px;
}
.menu li:hover li a{
background:none;
}
.menu li ul a{
display:block;
height:35px;
font-size:12px;
font-style:normal;
margin:0px;
padding:0px 10px 0px 15px;
text-align:left;
}
.menu li ul a:hover, .menu li ul li:hover a{
background:#00549E url(‘images/hover_sub.gif’) center left no-repeat;
border:0px;
color:#ffffff;
text-decoration:none;
}
.menu p{
clear:left;
}
Javascript slide show
[CODE]<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js”></script>
<script type=”text/javascript” src=”fadeslideshow.js”>
/***********************************************
* Ultimate Fade In Slideshow v2.0- (c) 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 this script and 100s more
***********************************************/
</script>
<script type=”text/javascript”>
var mygallery=new fadeSlideShow({
wrapperid: “fadeshow1”, //ID of blank DIV on page to house Slideshow
dimensions: [960, 365], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
[“images/slide/1.jpg”],
[“images/slide/2.jpg”],
[“images/slide/3.jpg”],
[“images/slide/4.jpg”] //<–no trailing comma after very last image element!
],
displaymode: {type:’auto’, pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 650, //transition duration (milliseconds)
descreveal: “ondemand”,
togglerid: “”
})
</script>
Javascript is called by a div: <div id=”fadeshow1″></div>