Created October 28, 2002

Dropdown Navigation Where Only Some Links Open New Windows

Question: I need to make a dropdown that spawns a new window for some options but not for others - in the same drop down.

Basically I need the ability to make some <option value""> open a new window others not.

Been trying to figure it out forever.

So if you choose to solve this puzzle let me know.

Answer:
Sure, here it is!

See more dropdown navigation solutions.

HTML Source

<form action="../">
<select onchange="parseNavigation(this)">
    <!-- in each option, the value should               -->
    <!-- include a pipe "|" character before each url,  -->
    <!-- to open in a new window, specify a window name -->
    <!-- urls may be local                              -->
    <option>Choose a destination to open in a attribute-controlled popup window!</option>
    <option value="|http://www.yahoo.com/">YAHOO</option>
    <option value="GoogleWin|http://www.google.com/">GOOGLE</option>
    <option value="WSDWin|http://websandiego.org/">WEBSANDIEGO</option>
    <option value="|http://www.altavista.com/">ALTAVISTA</option>
    <option value="|http://www.amazon.com/">AMAZON</option>
    <option value="ArtLungWin|https://artlung.com/">ARTLUNG</option>
</select>
</form>

Source Code

<script type="text/javascript" language="JavaScript">
<!--
function parseNavigation(ob) {
// created by joe crawford october 2002
// https://artlung.com/lab/scripting/dropdown-only-some-new-window/
toBeBrokenDown = ob.options[ob.selectedIndex].value.split("|");

targetWindow = toBeBrokenDown[0];
targetURL    = toBeBrokenDown[1];

	if (targetWindow!=='') {
	// if a new Window name is specified, then it will
	// open in a new Window.
	window.open(targetURL,targetWindow,'toolbar=1,location=1,directories=1,status=1,menubar=1,scrollbars=1,resizable=1,width=400,height=300');
	// if we open a new window, then we have to re-set
	// the select box to the first option
	// which should have no value
	ob.selectedIndex = 0;
		} else {
	// or else it will open in the current window		
	window.open(targetURL,'_top')
	}
}
//-->
</script>