You mean something like the following?
Code:
<!doctype html>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title></title>
<style>
body{font-family: verdana; font-size: 12px; padding-left:20px; padding-right: 20px}
</style>
<script>
function load_script_container()
{var div_node=document.createElement('div');
div_node.setAttribute("id", "script_container");
document.body.appendChild(div_node);}
//window.onload=load_script_container
if ( typeof window.addEventListener != "undefined" )
window.addEventListener( "load", load_script_container, false );
else if ( typeof window.attachEvent != "undefined" )
window.attachEvent( "onload", load_script_container );
else {
if ( window.onload != null ) {
var oldOnload = window.onload;
window.onload = function ( e ) {
oldOnload( e );
load_script_container();
};
}
else
window.onload = load_script_container;
}
function javascript_in_selectbox(which_box) {
var optionValue=document.getElementById(which_box).options[document.getElementById(which_box).selectedIndex].value;
if (optionValue=="none") {}
else {
var script_inside_selectbox_option = document.createElement('script');
script_inside_selectbox_option.type = 'text/javascript';
script_inside_selectbox_option.text = optionValue;
while(document.getElementById("script_container").firstChild)
{document.getElementById("script_container").removeChild(document.getElementById("script_container").firstChild);}
document.getElementById("script_container").appendChild(script_inside_selectbox_option);
}
}
function hide_it(tag,className) {
var els = document.getElementsByTagName(tag)
for (i=0;i<els.length; i++) {
if (els.item(i).className == className){
els.item(i).style.display="none"
}
}
}
var alertmessage="The window you're about to open doesn't have buttons for 'back' and 'forward', but you can use the keyboard: \n- press the BACKSPACE button for going back in the newly opened window, \n- use SHIFT+BACKSPACE for going forward in the newly opened window."
function prompt_once_per_session()
{
if( !/(^|\s|;)seenAlert=yes(;|\s|$)/.test(document.cookie))
{if( !confirm(alertmessage+'\n\nClick on OK if you don`t want this message to show again.\n\nClick on CANCEL if you want this message to show each time you open a new window.') )
{}
else {document.cookie="seenAlert=yes";}
}
}
var popUpWin ;
var url
var autoclose = true
var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1 ;
//Don't make the popup too high/wide, as this will result in a normal new tab in Opera
var w = screen.availWidth*70/100 //width: 70%
var h = screen.availHeight*60/100 //height:60%
var l=screen.availWidth*15/100-10 //left: 15% (with a slight correction of minus 10
var t=screen.availHeight*15/100 //top: 15%
function open_it(url){
if(is_chrome)prompt_once_per_session(); // message for Google Chrome users
if (popUpWin) {popUpWin.close()}
if (popUpWin && autoclose){window.onunload=function(){popUpWin.close()}}
popUpWin=window.open(url,"","menubar=yes, toolbar=yes, titlebar=yes, directories=no, status=0, scrollbars=yes,location=yes,top="+t+",left="+l+",width="+w+",height="+h+", resizable=1");
if (typeof(popUpWin)=='undefined') {
alert("Your browser tries to open:\n\n"+unescape(url)+".\n\nThat's a safe page, but your safety settings prevent to open it. Please disable your pop-up blocker and click the link again.");
}
if (window.focus){popUpWin.focus() }
}
</script>
</head>
<body onload="hide_it('select','select');hide_it('button','select')" onunload="hide_it('select','select');hide_it('button','select')">
<div style="position: relative; text-align: center; margin-top: 20px">
<b>Surf this site</b> → <select id="first_main" onchange="javascript_in_selectbox('first_main'); selectedIndex=0; " onfocus="selectedIndex=0" style="font-family: verdana; font-size: 12px; cursor: pointer; " >
<option selected>Select: Webmaster Resources & News</option>
<optgroup label="Open in new menu">
<option value="hide_it('select','select');document.getElementById('button').style.display='inline'; document.getElementById('second_select').style.display='inline'">Webmaster Resources</option>
<option value="hide_it('select','select'); document.getElementById('button').style.display='inline'; document.getElementById('third_select').style.display='inline'">News Sites</option>
</optgroup>
<optgroup label="Open directly in new window">
<option value="open_it('http://www.dynamicdrive.com')">DynamicDrive</option>
</optgroup>
</select>
<select id="second_main" onchange="javascript_in_selectbox('second_main'); selectedIndex=0; " onfocus="selectedIndex=0" style="font-family: verdana; font-size: 12px; cursor: pointer; " >
<option selected>Select: Regular Cars & Sports Cars</option>
<optgroup label="Open in new menu">
<option value="hide_it('select','select'); document.getElementById('button').style.display='inline'; document.getElementById('fourth_select').style.display='inline'">Regular Cars</option>
<option value="hide_it('select','select'); document.getElementById('button').style.display='inline'; document.getElementById('fifth_select').style.display='inline'">Sports Cars</option>
</optgroup>
<optgroup label="Open directly in new window">
<option value="open_it('http://www.toyota.co.uk')">Toyota</option>
<option value="open_it('http://www.porsche.com/uk')">Porsche</option>
</optgroup>
</select><br><br>
<select class="select" id="second_select" onchange="javascript_in_selectbox('second_select'); selectedIndex=0; " onfocus="selectedIndex=0" style="font-family: verdana; font-size: 12px; cursor: pointer; " >
<option selected>Selected: Webmaster Resources</option>
<option disabled>'Click-to-go' on an item below</option>
<option value="open_it('http://www.dynamicdrive.com')">DynamicDrive</option>
<option value="open_it('http://www.codingforums.com')">CodingForums</option>
<option value="open_it('http://www.w3schools.com')">W3Schools</option>
</select>
<select class="select" id="third_select" onchange="javascript_in_selectbox('third_select'); selectedIndex=0; " onfocus="selectedIndex=0" style="font-family: verdana; font-size: 12px; cursor: pointer; " >
<option selected>Selected: News Sites</option>
<option disabled>'Click-to-go' on an item below</option>
<option value="open_it('http://edition.cnn.com')">CNN</option>
<option value="open_it('http://www.bbc.co.uk/news')">BBC News</option>
<option value="open_it('http://www.foxnews.com')">Fox News</option>
</select>
<select class="select" id="fourth_select" onchange="javascript_in_selectbox('fourth_select'); selectedIndex=0; " onfocus="selectedIndex=0" style="font-family: verdana; font-size: 12px; cursor: pointer; " >
<option selected>Selected: Regular Cars</option>
<option disabled>'Click-to-go' on an item below</option>
<option value="open_it('http://www.toyota.co.uk')">Toyota</option>
<option value="open_it('http://www.ford.co.uk')">Ford</option>
<option value="open_it('http://www.nissan.co.uk')">Nissan</option>
</select>
<select class="select" id="fifth_select" onchange="javascript_in_selectbox('fifth_select'); selectedIndex=0; " onfocus="selectedIndex=0" style="font-family: verdana; font-size: 12px; cursor: pointer; " >
<option selected>Selected: Sports Cars</option>
<option disabled>'Click-to-go' on an item below</option>
<option value="open_it('http://www.porsche.com/uk')">Porsche</option>
<option value="open_it('http://www.astonmartin.com')">Aston Martin</option>
</select>
<button class='select' id="button" onmousedown="hide_it('select','select');hide_it('button','select')" onmouseup="hide_it('select','select');hide_it('button','select')">Reset</button>
</div><hr>
Rest of page
</body>
</html>
Bookmarks