According to the Ajax tag navigation Effect of yaohaixiao: http://www.blueidea.com/tech/web/2006/4144.asp.
Effect:
Http://www.lorlo.com/tab.html
Mainly changed JS:CopyCodeThe Code is as follows: <! --
Function GetObject (objectid ){
If (document. getelementbyid & document. getelementbyid (objectid )){
// W3C dom
Return document. getelementbyid (objectid );
}
Else if (document. All & document. All (objectid )){
// MSIE 4 dom
Return document. All (objectid );
}
Else if (document. Layers & document. Layers [objectid]) {
// NN 4 Dom.. Note: This won't find nested Layers
Return document. Layers [objectid];
}
Else {
Return false;
}
}
VaR responsecont;
VaR XMLHTTP;
VaR requesttype;
VaR newsstring;
VaR ajccache = new object (); // cache the accessed Data Page
VaR URL;
VaR mousedelaytime = 150; // mouse-induced delay
VaR waitinterval;
Function createxmlhttprequest (){
// Initialize Mozilla XMLHTTPRequest object
If (window. XMLHttpRequest ){
XMLHTTP = new XMLHttpRequest ();
}
// Initialize for IE/Windows ActiveX version
Else if (window. activexobject ){
Try {
XMLHTTP = new activexobject ("msxml2.xmlhttp. 3.0 ");
}
Catch (e ){
Try {
XMLHTTP = new activexobject ("Microsoft. XMLHTTP ");
}
Catch (e) {newsstring = "<Div class = 'loading'> loading rquest content fail, please try it again latter... </div> ";}
}
}
}
Function getnews (tagid, x ){
Url = "tab/" tagid='_'{x}'.html ';
// Var loadstatustext = "<Div class = 'loading'> loading request content, please wait... </div> ";
Requesttype = tagid;
If (ajccache [url] = NULL ){
Createxmlhttprequest ();
// GetObject (requesttype + '_ CNT'). innerhtml = loadstatustext;
XMLHTTP. onreadystatechange = processrequestchange;
XMLHTTP. Open ("get", URL, true );
XMLHTTP. setRequestHeader ("If-modified-since", "0 ");
XMLHTTP. Send (null );
}
Else
{Shownews (requesttype, ajccache [url]);}
}
Function processrequestchange (){
// Only if XMLHTTP shows "complete"
If (XMLHTTP. readystate = 4 ){
// Only the HTTP 200 to process
If (window. Location. href. indexof ("HTTP") =-1 | XMLHTTP. Status = 200 ){
Newsstring = XMLHTTP. responsetext;
// Inject centent to tab-pane
Shownews (requesttype, newsstring );
Ajccache [url] = newsstring; // cache the accessed Data
}
}
}
Function shownews (requesttype, newsstring ){
// <! [CDATA [
Responsecont = GetObject (requesttype + '_ CNT ');
Responsecont. innerhtml = newsstring;
//]>
}
Function tabnews (tagid, x ){
For (VAR I = 1; I <= 7; I + = 2 ){
If (I = x ){
GetObject (tagid + I). classname = "tabactive" + I;
If (I! = 1 ){
GetObject (tagid + (I-1). style. Display = "NONE ";
If (I! = 7 ){
GetObject (tagid + (I + 1). style. Display = "NONE ";
}
}
If (I = 1 ){
GetObject (tagid + "2"). style. Display = "NONE ";
}
Try {
Getnews (tagid, I );
}
Catch (e ){
Alert (E );
}
}
Else
{
GetObject (tagid + I). classname = "";
If (I! = 7 ){
GetObject (tagid + (I + 1). style. Display = "Block ";
}
}
}
}
VaR IDN;
Function AET (objid, tagid, ETP) {// Add event objid to Li: container ID tagid: group ETP: trigger type 0-onmouseover 1-onclick
VaR IIF = 0;
VaR Lis = objid. getelementsbytagname ('lil ');
Requesttype = tagid;
Url = "tab/" + requesttype + "_1.html ";
Ajccache [url] = GetObject (requesttype + '_ CNT'). innerhtml;
For (VAR Iy = 0; Iy <Lis. length; Iy ++ ){
If (IIF = 0 ){
IIF = 1;
With (LIS [Iy]) {
If (ETP = 0 ){
Lis [Iy]. onmouseover = function (){
If (this. Status = "active") return;
Requesttype = attributes. getnameditem ('id'). value. substring (0, attributes. getnameditem ('id'). value. Length-1 );
IDN = parseint (attributes. getnameditem ('id '). value. substring (attributes. getnameditem ('id '). value. length-1, attributes. getnameditem ('id '). value. length ));
Cleartimeout (waitinterval );
Waitinterval = Window. setTimeout ("tabnews (requesttype, IDN);", mousedelaytime );
}
Lis [Iy]. onmouseout = function () {If (this. Status = "active") return; cleartimeout (waitinterval );}
}
If (ETP = 1 ){
Lis [Iy]. onmouseover = function (){}
Lis [Iy]. onclick = function (){
If (this. Status = "active") return;
Requesttype = attributes. getnameditem ('id'). value. substring (0, attributes. getnameditem ('id'). value. Length-1 );
IDN = parseint (attributes. getnameditem ('id '). value. substring (attributes. getnameditem ('id '). value. length-1, attributes. getnameditem ('id '). value. length ));
VaR loadstatustext = "<Div class = 'loading'> loading request content, please wait... </div> ";
GetObject (requesttype + '_ CNT'). innerhtml = loadstatustext;
Tabnews (requesttype, IDN );
}}}}
Else {IIF = 0 ;}
}
}
Function ATA (objid) {// an unrelated function.
VaR as = objid. getelementsbytagname ('A ');
For (VAR I = 0; I <as. length; I ++ ){
As [I]. pathname = "/showfile.html ";
}
}
// -->