Hi Everyone!
I am updating my website and need some help with a tricky part. It will probably be simple for some of you guys, but im a bit of a beginner. i can make the sites how there meant to look using basic xhtml and css. but i want to change 1 thing and every time i do it, the whole thing goes arse over tit.
The current Site
Now, at the very bottom of the screen you'll see a jumpMenu that very cruedlty changes the colour of the theme buy linking to an alternative index.html and loading it in the iframe.
what i want to do is make a jump menu that works the same. so it'll load the 5 different pages in the iframe and function just like it does now.... BUT! I wanna make it float at the bottom left of the window, so that its always on view and doesnt need the unsightly grey bar i have it displayed on just now.
Can this be done easily???
Below is the main page code, the red sections highlighted are the parts that control the current jumpMenu.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>{ The Faded } SSCU Trench Wars Squad</title>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" />
<meta name="author" content="This is Star" />
<meta name="keywords" content="SSCU, Trench Wars, Subspace, Continuum, The Faded" />
<meta name="description" content="A Squad site for The Faded, SSCU Trench Wars Squad" />
<meta name="robots" content="index, follow, noarchive" />
<meta name="googlebot" content="noarchive" />
<link rel="stylesheet" type="text/css" href="css/screen.css" media="screen, print" />
<script type="text/javascript">
<!--
function MM_jumpMenuGo(objId,targ,restore){ //v9.0
var selObj = null; with (document) {
if (getElementById) selObj = getElementById(objId);
if (selObj) eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if (restore) selObj.selectedIndex=0; }
}
//-->
</script>
</head>
<body >
<iframe src="http://thefadedred.110mb.com/index.html" width="100%" height="749" scrollbar="no" name="colourchangemain" frameborder="0" style="border:none" style="margin:0" style="outline:none">
<p>Your browser does not support iframes.</p>
</iframe>
<form id="form">
<select name="jumpMenu" id="jumpMenu">
<option value="http://thefadedred.110mb.com/index.html">Terrier</option>
<option value="http://thefadedgrey.110mb.com/index.html">Warbird</option>
<option value="http://thefadedblue.110mb.com/index.html">Leviathan</option>
<option value="http://thefadedyellow.110mb.com/index.html">Javelin</option>
<option value="http://thefadedgreen.110mb.com/index.html">Spider</option>
</select>
<input type="button" name="go_button" id= "go_button" value="Go" onclick="MM_jumpMenuGo('jumpMenu','colourchangemain',0)" />
</form></body>
</html>
I would also like to know if is possible to style the jumpMenu with css, cause i cannot figure that out.
Hope you can help.
Thanks in advance.