Page changes back after clicking tab?

[PGTibs]

I have sorted an earlier problem with the use of javascript tabs, however, it originally changed when you rolled over, i have changed apart of the javascript so that it works on click. However after a few seconds it changes back to the first tab. What is wrong with this javascript?

 

//DD Tab Menu- Script rewritten April 27th, 07: http://www.dynamicdrive.com
//**Updated Feb 23rd, 08): Adds ability for menu to revert back to default selected tab when mouse moves out of menu

//Only 2 configuration variables below:

var ddtabmenu={
disabletablinks: true, //Disable hyperlinks in 1st level tabs with sub contents (true or false)?
snap2original: [false], //Should tab revert back to default selected when mouse moves out of menu? ([true/false, delay_millisec]

currentpageurl: window.location.href.replace("http://"+window.location.hostname, "").replace(/^\//, ""), //get current page url (minus hostname, ie: http://www.dynamicdrive.com/)

definemenu:function(tabid, dselected){
this[tabid+"-menuitems"]=null
this[tabid+"-dselected"]=-1
this.addEvent(window, function(){ddtabmenu.init(tabid, dselected)}, "load")
},

showsubmenu:function(tabid, targetitem){
var menuitems=this[tabid+"-menuitems"]
this.clearrevert2default(tabid)
for (i=0; i<menuitems.length; i++){
	menuitems[i].className=""
	if (typeof menuitems[i].hasSubContent!="undefined")
		document.getElementById(menuitems[i].getAttribute("rel")).style.display="none"
}
targetitem.className="current"
if (typeof targetitem.hasSubContent!="undefined")
	document.getElementById(targetitem.getAttribute("rel")).style.display="block"
},

isSelected:function(menuurl){
var menuurl=menuurl.replace("http://"+menuurl.hostname, "").replace(/^\//, "")
return (ddtabmenu.currentpageurl==menuurl)
},

isContained:function(m, e){
var e=window.event || e
var c=e.relatedTarget || ((e.type=="mouseover")? e.fromElement : e.toElement)
while (c && c!=m)try {c=c.parentNode} catch(e){c=m}
if (c==m)
	return true
else
	return false
},

revert2default:function(outobj, tabid, e){
if (!ddtabmenu.isContained(outobj, tabid, e)){
	window["hidetimer_"+tabid]=setTimeout(function(){
		ddtabmenu.showsubmenu(tabid, ddtabmenu[tabid+"-dselected"])
	}, ddtabmenu.snap2original[1])
}
},

clearrevert2default:function(tabid){
if (typeof window["hidetimer_"+tabid]!="undefined")
	clearTimeout(window["hidetimer_"+tabid])
},

addEvent:function(target, functionref, tasktype){ //assign a function to execute to an event handler (ie: onunload)
var tasktype=(window.addEventListener)? tasktype : "on"+tasktype
if (target.addEventListener)
	target.addEventListener(tasktype, functionref, false)
else if (target.attachEvent)
	target.attachEvent(tasktype, functionref)
},

init:function(tabid, dselected){
var menuitems=document.getElementById(tabid).getElementsByTagName("a")
this[tabid+"-menuitems"]=menuitems
for (var x=0; x<menuitems.length; x++){
	if (menuitems[x].getAttribute("rel")){
		this[tabid+"-menuitems"][x].hasSubContent=true
		if (ddtabmenu.disabletablinks)
			menuitems[x].onclick=function(){return false}
		if (ddtabmenu.snap2original[0]==true){
			var submenu=document.getElementById(menuitems[x].getAttribute("rel"))
			menuitems[x].onmouseout=function(e){ddtabmenu.revert2default(submenu, tabid, e)}
			submenu.onmouseover=function(){ddtabmenu.clearrevert2default(tabid)}
			submenu.onmouseout=function(e){ddtabmenu.revert2default(this, tabid, e)}

		}
	}
	else //for items without a submenu, add onMouseout effect
		menuitems[x].onmouseout=function(e){this.className=""; if (ddtabmenu.snap2original[0]==true) ddtabmenu.revert2default(this, tabid, e)}
	menuitems[x].onclick=function(){ddtabmenu.showsubmenu(tabid, this)}
	if (dselected=="auto" && typeof setalready=="undefined" && this.isSelected(menuitems[x].href)){
		ddtabmenu.showsubmenu(tabid, menuitems[x])
		this[tabid+"-dselected"]=menuitems[x]
		var setalready=true
	}
	else if (parseInt(dselected)==x){
		ddtabmenu.showsubmenu(tabid, menuitems[x])
		this[tabid+"-dselected"]=menuitems[x]
	}
}
}
}

 

The website address is http://www.controlhost.co.uk/imastore/index.php

[Psycho]

1. Why on earth would you want to use JavaScript for site navigation? Doing so would render the site completely useless to anyone without javascript enabled and/or anyone with a browser with compatibility issues.

 

2. The page isn't even properly formatted. It starts out like this:

	<form action='includethis.php'>
<input type='hidden' name='email' size='26' value='Enter your email' onfocus="this.value=''">
<input type='hidden' value='Subscribe'>
<input type='hidden' name='action' value='subscribe'>
</form>
<head>
<meta http-equiv="Content-Language" content="en-us" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

Why is there a "form" before the page has even been declared and there is no opening HTML tag.

 

I tried to debug the code you provided and the code on your site. But, the tabs seem to be created dynamically in the JavaScript and I wasn't able to ascertain which function is called or what parameters are sent.

[xtopolis]

The "problem" is probably coming from the lines that look like this:

ddtabmenu.revert2default

because there are lines near that it register the onmouseover and onmouseout events (in a few locations).

 

However, I went to your site and clicking on the [...] tabs next to upload, it said that the content was empty, so it redirected me.

 

Anyway, mjdamato is right, you should probably use something less javascripty, and moreover something that you can understand.

[PGTibs]

Got anything in mind? I basically want the same kind of idea with the tabs to change the functions in the middle, but don't really want to go and have numerous pages with the same layout just different buttons selected if that makes sense.

 

2. The page isn't even properly formatted. It starts out like this:

Code: [select]

  <form action='includethis.php'>

  <input type='hidden' name='email' size='26' value='Enter your email' onfocus="this.value=''">

  <input type='hidden' value='Subscribe'>

  <input type='hidden' name='action' value='subscribe'>

  </form>

  <head>

<meta http-equiv="Content-Language" content="en-us" />

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

Why is there a "form" before the page has even been declared and there is no opening HTML tag.

 

It's like this for the newsletter part. It might not be right but it sure does work the way i want it to. Unless it's causing other problems i'd rather prefer to leave it.

[xtopolis]

Find an easier tab script?  Use an iframe?  Use ajax?  There are many solutions available, but it's just up to you what you want to do.  However I am not going to modify your third party script.