AJAX Navigation Menu

JavaScriptBank

Bannato
26 Nov 2009
86
0
0
Use this JavaScript instead of frames. When a visitor clicks on a specific link, the content of that link is inserted into the page without a refresh. When a page doesn... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


How to setup

Step 1: Use JavaScript code below to setup the script
JavaScript
Codice:
<script language="javascript">

// Created by: Michael :: http://www.posters-bestellen.nl

var please_wait = null;

function open_url(url, target) {
 	if ( ! document.getElementById) {
  		return false;
 	}

 	if (please_wait != null) {
  		document.getElementById(target).innerHTML = please_wait;
 	}

 	if (window.ActiveXObject) {
  		link = new ActiveXObject("Microsoft.XMLHTTP");
 	} else if (window.XMLHttpRequest) {
  		link = new XMLHttpRequest();
 	}

 	if (link == undefined) {
  		return false;
 	}
 	link.onreadystatechange = function() { response(url, target); }
 	link.open("GET", url, true);
 	link.send(null);
}

function response(url, target) {
 	if (link.readyState == 4) {
	 	document.getElementById(target).innerHTML = (link.status == 200) ? link.responseText : "Ooops!! A broken link! Please contact the webmaster of this website ASAP and give him the fallowing errorcode: " + link.status;
	}
}

function set_loading_message(msg) {
 	please_wait = msg;
}
</script>

Step 2: Place HTML below in your BODY section
HTML
Codice:
<script type="text/javascript">
<!--
/* This script and many more are available free online at
Created by: Michael :: http://www.posters-bestellen.nl */

  set_loading_message("Please wait while the page is opening....");
//-->

</script>
<table>
<tr>
<td valign=top width=150>
<H5>My Navagation links</H5>
<a href="javascript:void(0)" onclick="open_url('page-1.html','my_site_content');">
Go to page 1</a><br>
<a href="javascript:void(0)" onclick="open_url('page-2.html','my_site_content');">
Go to page 2</a><br>
<a href="javascript:void(0)" onclick="open_url('page-3.html','my_site_content');">
Go to page 3</a><br>
<a href="javascript:void(0)" onclick="open_url('page-4.html','my_site_content');">
Go to page 4</a><br>

<a href="javascript:void(0)" onclick="open_url('xxxx.html','my_site_content');">
Broken Link</a><br>
</td>
<td valign=top>
<div id="my_site_content">
</div>
</td>
</tr>
</table>






 
Discussioni simili
Autore Titolo Forum Risposte Data
R valore value di un id da passare in chiamata ajax Ajax 3
R jquery che cambia css di un elemento non mi funziona sulla pagina caricata da ajax Ajax 5
M Fullcalendar in Codeigniter, un aiuto per la chiamata $ajax ? jQuery 0
R Aggiornare record mysql con Ajax, jQuery e php Ajax 2
P Funzione jQuery Ajax invio file a php jQuery 1
E Php select option e ajax PHP 23
Emix Select concatenate php sql ajax PHP 2
MarcoGrazia Valori di ritorno json via ajax non visti. jQuery 1
felino ASP.net MVC: Exception e chiamata AJAX ASP.NET 1
motleyrulez Ricerca filtro con Ajax PHP 1
max1974 Grafico Ajax Javascript 4
max1974 Struttura $.ajax Ajax 7
C la chiamata ajax non ritorna alcun dato Ajax 1
max1974 Lettura Risultato $.ajax Javascript 1
motleyrulez Chiamata ajax per tabella php PHP 3
max1974 [Javascript] Grafico chartjs con dati da J.ajax Javascript 3
O [PHP] inviare dati da form e script ajax PHP 0
F limit show datatable ajax Ajax 1
Domenico_Falco1 Rendere dinamico un sito web con chiamate ajax e php e variabili json PHP 12
G Eseguire codice solo al termine della chiamata ajax Ajax 1
L Problema jQuery validation AJAX (PHP 7) PHP 6
max1974 [Javascript] Grafico ajax non funziona Javascript 0
WorldWideWeb Ajax POST con risposta JSON Ajax 2
M leggere con jquery/ajax in una function javascript record di database sql server Javascript 0
A [Javascript] Ajax, Jquery e PHP Javascript 1
D [Javascript] pulsanti per comandi shell con php e ajax Ajax 7
X Problema con jquery e ajax jQuery 2
B [PHP] variabili globali in chiamate ajax PHP 0
B DEBUG - PHP+JS+AJAX PHP 10
M Inserimento dati checkbox multipli in db da ajax a php PHP 1
Axis18 Creare una barra di avanzamento con $.ajax Ajax 7
otto9due Chiamata ajax su due url è possibile? Ajax 0
G [Javascript] Problema parametro passato con ajax Javascript 4
G Chiamata ajax restituisce errore random Ajax 1
paloppa [PHP] paginazione con ajax PHP 1
filomeni Ajax e https Ajax 4
bubino8 Ajax con risultato si/no Ajax 16
A redirect da pagina php chiamata da ajax PHP 2
L Aggiungere contenuto con ajax durante lo scroll jQuery 1
M Ajax funziona in alcuni siti, in altri no! Ajax 2
otto9due Risposta ajax -> json con php Ajax 3
bubino8 [PHP] split con ajax non funziona PHP 7
C Problema chiamata Ajax Ajax 2
A Visualizzare div quando le immagini sono state uploadate con successo (Ajax) Ajax 0
S Select Concatenate Ajax, php, sql Presentati al Forum 16
otto9due Error anomalo durante invio dati $.ajax Ajax 20
F Interazione tra i form html ajax e php PHP 3
D Come salvare scelta della select "dinamica" ajax-php? Come dato php o attributo value tag option? Ajax 5
D Sono disperato: Menu select dinamici con Ajax e PHP PHP 1
D Sono disperato: Menu select dinamici con Ajax e PHP Ajax 2

Discussioni simili