|
HTML - Drop-down Menu Falls Behind Slide Show
Hello,
I am in the very early stages of redesigning our home page. The drop down menus at the top of the page fall behind our rotating (slideshow) images. http://jaxpubliclibrary.org/new-home3.html Z-index does not work to correct this problem. I'd appreciate any help you can give me. Thank you. Linda Similar TutorialsHi, I am working on a form. The second question depends on what the user has selected for the first question, so I have managed to set it to "Hidden" onload. This works fine. The first question is a drop-down menu option, and depending on the answer given will determine weather question 2 needs answering. I can get question to appear, if the user selects an answer needing question two answering. But if they make a mistake and decide to change the answer, question 2 won't hide again. Here is the script and html: Code: <script language=javascript type='text/javascript'>
function hidediv() {
if (document.getElementById) { // DOM3 = IE5, NS6
document.getElementById('hideshow').style.visibility = 'hidden';
}
else {
if (document.layers) { // Netscape 4
document.hideshow.visibility = 'hidden';
}
else { // IE 4
document.all.hideshow.style.visibility = 'hidden';
}
}
}
function showdiv() {
if (document.getElementById) { // DOM3 = IE5, NS6
document.getElementById('hideshow').style.visibility = 'visible';
}
else {
if (document.layers) { // Netscape 4
document.hideshow.visibility = 'visible';
}
else { // IE 4
document.all.hideshow.style.visibility = 'visible';
}
}
}
</script>
<body id="tt13" onload="javascript:hidediv()">
Code: <li>
<h3> Services Required</h3>
<label for="website">What services will you need?<br />
<select name="website" class="textarea" id="websites" onchange="javascript:showdiv()">
<option selected="selected" onchange="javascript:hidediv()">Please Choose:</option>
<option onchange="javascript:showdiv()">Web Site Only</option>
<option onchange="javascript:showdiv()">Web Site & Hosting</option>
<option onchange="javascript:showdiv()">Web Site & Domain</option>
<option onchange="javascript:showdiv()">Web Site, Hosting & Domain</option>
<option onchange="javascript:hidediv()">None of These</option>
</select>
</label>
</li>
<li id="hideshow">
<br />
How many pages do you think will you need?<br />
<select name="Pages" class="textarea">
<option value="#" selected="selected">Please Choose:</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<option>18</option>
<option>19</option>
<option>20+</option>
<option>I'm Not Sure.</option>
</select>
</li>
I think it's something I've set wrong in onchange"" etc.. I've tried "onclick". Any ideas why the menu won't hide again? So here's hoping you fine people will be able to help me I've found similar things, but not like this. I have a HTML Form, just a normal simple form, the data is sent using POST method to PHP, PHP has a thank you page, I get the E-Mail easy! >> Boring Part Start << This website is a online booking form for holidays in Cornwall, UK. People enter there info, then the party info. The thing is people in the party could be 1, could be 5, could be 8, or even just 2. >> Boring Part End << I Want A Drop Down Menu that will be able to hide forms or show forms So, it goes like this Title First Name Last Name Date Of Birth [field] [field] [field] [field] [field] [field] [field] [field] [field] [field] [field] [field] But I want it so, if someone picks the number 1 from this drop down list, only the first row of forms, or if someone picks 5, it shows 5 rows and if someone clicks 2, it only shows 2. I was wondering if I could use the Drop Down to hide DIV's or something and put each row in a DIV. Oh and btw, the fields are in tables at the moment. I made that more complicated then I should off ... lol. My HTML skill isn't that good, but I'll get my hands dirty if I must. Jme I have tried to find a code for my site to add a slide show for photo's with no luck, has anyone done this and can anyone help me out here? Thanks I'm trying to figure out how to create a slide show within a static sliced webpage. I'm self taught with Fireworks and am pretty confident however always willing to learn from others whenever I get the chance. The page is for a friend, they have asked me if its possible to have a maximum of 3 images that roatate on a slide show within the page, so the first picture will be there for 4 seconds then the next and so on. Thanks in advance... I have a CD that has a slide show of a fashion show. How can I add this slide show to my web site so that by just clicking on a designated word the slide show will begin? Much appreciated, Jaymom I want to have multiple banners appear every couple seconds like a slide show. Here is my website. (http://www.dubcityfilms.com) The banner is the one with the cars on it. I want to have 5 or so different ones that randomly switch. Can someone help me with this? Thanks. Hi, I like to show picture like a slide show like below link http://www.giftedpenguin.co.uk/ PLease tell me how to do that,do i need to do j-script or something? thanks This slide show, which I like the functions of, show the size of the show by the side of the photo. Is there a way, other than changing all pictures to about the same size that I can keep the slide show uniform? show at link below TIA http://www.nomagicneon.com/customerphotos.html hi all im after advice on the best way to create a vertical slide show that only changes on a page refresh the images will be shown with a negative film as a frame that is repeated vertically then i will use php code to show a random image inside the frame so, which will be best using the frame as a repeated background image then having a div with the image overlapping this or manually displaying a large image that i have repeated in photoshop. I am in need of assistance. I have generated a script for a slide in menu and on its own it works alright. However when I try to set it up for multiple slide menus in the same webpage I run in to some issues. Primarily the script only working for one slide on both tabs. So tab 1 hides and and un hides menu and tab 2 does the same thing. Any Ideas???Also when the page loads i need the menu to be closed below I have included the base script Im using any help would be great...thank you <HTML> <head> <style> #tabdiv { z-index: 2; left: 220px; position: absolute; top: 210px } #textdiv { z-index: 1; padding-top: 10px; position: absolute; top: 200px; border-top-width: 1px; padding-right: 5px; padding-left: 5px; border-left-width: 1px; border-left-color: #000099; left: 0px; border-bottom-width: 1px; border-bottom-color: #000099; padding-bottom: 10px; width: 220px; color: black; border-top-color:GREEN; background-color:GREEN; border-right-width: 1px; border-right-color:GREEN } </style> <SCRIPT language=JavaScript1.2> if (document.layers) {n=1;ie=0} if (document.all) {n=0;ie=1} function init() { if (n) tab = document.tabDiv if (n) poptext = document.textdiv if (ie) tab = tabDiv.style if (ie) poptext = textdiv.style } var tabShow=1; function myfunction() { if (tabShow == 1) { if (n) { tab.visibility = "hide"; tab.left = 0; tab.visibility = "show"; poptext.visibility = "hide"; tabShow = 0; return; } if (ie) { tab.visibility = "hidden"; tab.left = 0; tab.visibility = "visible"; poptext.visibility = "hidden"; tabShow = 0; return; } } if (tabShow == 0) { if (n) { tab.visibility = "hide"; tab.left = 220; tab.visibility = "show"; poptext.visibility = "show"; tabShow = 1; } if (ie) { tab.visibility = "hidden"; tab.left = 220; tab.visibility = "visible"; poptext.visibility = "visible"; tabShow = 1; } } } </SCRIPT> </head> <body onload=init()> <!-- Slide-in table start --> <DIV id=tabDiv><B>IRA</B><a href="javascript:myfunction();"> <IMG alt="Click here to close" src="images/popout_menu.gif" width=14 border=0></a></DIV> <DIV id=textdiv> <font face="Verdana" size="2"><B>INDIVIDUAL RETIREMENT ACCOUNT</B></font><br> <font face="Verdana" size="1">IRA is held at a custodian institution such as a bank or brokerage, and may be invested in anything that the custodian allows (for instance, a bank may allow certificates of deposit, and a brokerage may allow stocks and mutual funds). Unlike the Roth IRA, the only criterion for being eligible to contribute to a Traditional IRA is sufficient income to make the contribution.Transactions in the account, including interest, dividends, and capital gains, are not subject to tax while still in the account, but upon withdrawal from the account, withdrawals are subject to federal income tax. </font><br> </DIV> <!-- Slide-in table end --> </body> </HTML> </HTML> site: www.lukewhitlow.com/waterbuffalo right now this is an early rough draft of a site and the formatting is way off when I view it in IE. Is there any way to fix this? I don't use IE and usually don't even bother troubleshooting for it, but I've got the latest version installed and it loads other pages fine. I use Dreamweaver for all of my coding, and when I view the page before I upload it (while it's local) everything looks fine. After I FTP (filezilla) the site to my server (bluehost) and view it, the text goes awry on IE but still works fine on other browsers. I'm trying to stick with divs instead of a table based design here, so I'm guessing there's an issue in my css div styles... or maybe something on my server? since it only affect the site once it's on the server. Thanks in advance for your help! Why do the images in the background show through the drop in box on my site? http://www.nomoreheartdiseaseandstrokes.com/ Should I put all the information within a table in the drop in box? Thanks I have a drop down menu on my page, and I want to change the background color of the box from white to match the rest of the page, how do I do this. Thanks Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="language" content="english">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>Welcome to my Home Page</title>
<script language="JavaScript" type="text/javascript">
////The source for this script came from http://allwebco-templates.com/support/S_menus_dropdown.htm////
///For the Game,I changed the back ground picture. I realize it's not JS///
<!--
function land(ref, target)
{
lowtarget=target.toLowerCase();
if (lowtarget=="_self") {window.location=loc;}
else {if (lowtarget=="_top") {top.location=loc;}
else {if (lowtarget=="_blank") {window.open(loc);}
else {if (lowtarget=="_parent") {parent.location=loc;}
else {parent.frames[target].location=loc;};
}}}
}
function jump(menu)
{
ref=menu.choice.options[menu.choice.selectedIndex].value;
splitc=ref.lastIndexOf("*");
target="";
if (splitc!=-1)
{loc=ref.substring(0,splitc);
target=ref.substring(splitc+1,1000);}
else {loc=ref; target="_self";};
if (ref != "") {land(loc,target);}
}
//-->
<!--
/// The JS below is for the date and time. and i got the sorce from http://www.re-es.org/ ///
var day_names = new Array(7)
day_names[0] = "Sunday"
day_names[1] = "Monday"
day_names[2] = "Tuesday"
day_names[3] = "Wednesday"
day_names[4] = "Thursday"
day_names[5] = "Friday"
day_names[6] = "Saturday"
var month_names = new Array(12)
month_names[0] = "January"
month_names[1] = "February"
month_names[2] = "March"
month_names[3] = "April"
month_names[4] = "May"
month_names[5] = "June"
month_names[6] = "July"
month_names[7] = "August"
month_names[8] = "September"
month_names[9] = "October"
month_names[10] = "November"
month_names[11] = "December"
date_now = new Date()
day_value = date_now.getDay()
date_text = day_names[day_value]
month_value = date_now.getMonth()
date_text += " " + month_names[month_value]
date_text += " " + date_now.getDate()
date_text += ", " + date_now.getFullYear()
minute_value = date_now.getMinutes()
if (minute_value < 10) {
minute_value = "0" + minute_value
}
hour_value = date_now.getHours()
if (hour_value == 0) {
greeting = "Good Morning "
time_text = " at " + (hour_value + 12) + ":" + minute_value + " AM"
}
else if (hour_value < 12) {
greeting = "Good Morning "
time_text = " at " + hour_value + ":" + minute_value + " AM"
}
else if (hour_value == 12) {
greeting = "Good Afternoon "
time_text = " at " + hour_value + ":" + minute_value + " PM"
}
else if (hour_value < 17) {
greeting = "Good Afternoon "
time_text = " at " + (hour_value - 12) + ":" + minute_value + " PM"
}
else {
greeting = "Good Evening"
time_text = " at " + (hour_value - 12) + ":" + minute_value + " PM"
}
document.write(greeting + " Today is " + date_text + time_text)
//-->
</script>
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div id="container">
<p><img id="banner" src="images/banner.gif" alt="banner"></p><hr color="#FF0000"></p>
<ul id="nav">
<li><form action="#" method="post">
<select name="choice" size="1" onChange="jump(this.form)" class="dropdown">
<option value="index.html" selected>Home</option>
<option value="scripts_developed.html">Scripts Developed</option>
<option value="best_practices.html">Best practices for JavaScript coding</option>
<option value="ajax.html">AJAX</option>
<option value="JavaScript_frustrations.html">JavaScript frustrations & Javascript Game</option>
</select>
</form>
</li>
</ul>
<div id="content"></div>
</div>
<table width="1050" border="0" align="center">
<tr>
<td align="center"><p><img src="images/logo1.gif" width="300" height="300" hspace="30"><img src="images/logo3.gif" width="300" height="300"><img src="images/logo2.gif" width="300" height="300"></p>
<p><img src="images/logo4.gif" width="300" height="300" hspace="30"><img src="images/logo5.gif" width="300" height="300"><img src="images/logo6.gif" width="300" height="300"></p></td>
</tr>
</table>
<p> </p>
<p> </p>
</body>
</html>
I want to create a drop down bar using images, like the one on this page: http://www.teamtalk.com/ I already have the images which I want to use. I have scoured the internet for how to do it and tried many, many tutorials but I don't understand how to do it. Please help! Hi all, I can't for the life of me get the submenus to work. Here is my basic code and style sheet. How and where do I get a sub menu working on the navigation to display when you hover over it. I.E. hovering over 'News' displays sub menu of 'today', 'tomorrow'... Hello im looking for a script for my website that offers the following I have an image link, that I want to rollover to another image (Of the text glowing) then have a drop down menu pop up below it that can have other menus drop down from that one.) Right now Im trying a Javascript that I found for free on the internet but i cant seem to get it working. http://javascript-array.com/scripts/...rop_down_menu/ But I cant get it to be a rollover image instead of a text box. and it doesnt support multiple drop downs like this one: http://javascript-array.com/scripts/..._down_menu/?sb plus they want you to pay for it, and im looking for a free solution. Any help appreciated, thanks. So, I am new to html, but I want my site to have a drop down menu, much like that of IBM's. http://www.ibm.com/us/en/sandbox/ver2/ Is this even possible with HTML? If so, where do I start? Regards, YahtzeeFish Hi All, This is my first post so please be kind I am currently trying to create 3 drop down menus in a top frame going across the top of the page. This is my first time trying to do anything like this and have run into a few issues i cant get my head around nor find an answer on the net. The code i have so far is this: _______________________________________________________________ <HTML> <HEAD> <TITLE> Test</TITLE> <BODY> </BODY> <SCRIPT TYPE="text/javascript"> <!-- function dropdown(mySel) { var myWin, myVal; myVal = mySel.options[mySel.selectedIndex].value; if(myVal) { if(mySel.form.target)myWin = parent[mySel.form.target]; else myWin = window; if (! myWin) return true; myWin.location = myVal; } return false; } //--> </SCRIPT> </HEAD> <div align="center"> <table border="1" cellpadding="4" width=500> <FORM METHOD=POST onSubmit="return dropdown(this.gourl)" TARGET=MAIN > <SELECT NAME="gourl"> <OPTION VALUE="">Choose a Destination... <OPTION VALUE="C:\Users\Desktop\a.htm">User Manuals </SELECT> <INPUT TYPE=SUBMIT VALUE="Go"> </FORM> <FORM METHOD=POST onSubmit="return dropdown(this.gourl)" TARGET=MAIN > <SELECT NAME="gourl"> <OPTION VALUE="">Choose a Destination... <OPTION VALUE="C:\Users\Desktop\a.htm">User Manuals </SELECT> <INPUT TYPE=SUBMIT VALUE="Go"> </FORM> <FORM METHOD=POST onSubmit="return dropdown(this.gourl)" TARGET=MAIN > <SELECT NAME="gourl"> <OPTION VALUE="">Choose a Destination... <OPTION VALUE="C:\Users\Desktop\a.htm">User Manuals </SELECT> <INPUT TYPE=SUBMIT VALUE="Go"> </FORM> </HTML> _______________________________________________________________ 1) When selecting 'User Manuals' on the drop down box, it opens up a new window and directs me back to the home page? 2) i am unsure as to how you place the drop down boxes side by side aligned at the top of the page? Is anyone able to help me out here? Cheers in advance Hey guys, I am very new to web design, however have some basic knowledge of html. I am designing a simple site which needs a drop down menu tab for only ONE TAB in the nav bar. See the following site for an example: http://www.dynamicdrive.com/dynamici...wntabsdemo.htm Again I need a drop down menu for only one tab. How do I achieve this? Id like to do a drop down menu similar to there's... is there any simple way of doing this?! |
|||||||