Rumah > hujung hadapan web > tutorial js > JS melaksanakan secara automatik menukar kesan menu navigasi kemahiran code_javascript

JS melaksanakan secara automatik menukar kesan menu navigasi kemahiran code_javascript

WBOY
Lepaskan: 2016-05-16 15:40:03
asal
1066 orang telah melayarinya

Contoh dalam artikel ini menerangkan kod untuk menukar kesan menu navigasi secara automatik menggunakan JS. Kongsikan dengan semua orang untuk rujukan anda. Butirannya adalah seperti berikut:

Menu navigasi JS yang berubah secara automatik bertukar secara automatik mengikut masa Sila rujuk jika perlu.

Tangkapan skrin kesan berjalan adalah seperti berikut:

Alamat demo dalam talian adalah seperti berikut:

http://demo.jb51.net/js/2015/js-auto-cha-nav-menu-style-codes/

Kod khusus adalah seperti berikut:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>导航菜单</title>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
site = "http://www.qq.com"; // Do not include the final "/"
function combineMenus(frm, menu1, menu2) {
with (frm) {
str = menu1.options[menu1.selectedIndex].value;
str += menu2.options[menu2.selectedIndex].value;
url = site + "/" + str + ".htm";
window.location.href = url;
  }
}
// End -->
</script>
<form name=menufrm>
<select name=menu1>
<option value="">时间类</option>
<option value="time">time</option>
</select>
<select name=menu2>
<option value="">哪个</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<input type=button value="Select" onClick="combineMenus(this.form, this.form.menu1, this.form.menu2)">
</form> 
<SCRIPT LANGUAGE="JavaScript">
function makeArray(q){
for(i=1 ; i < q ; i++){this[i]=0}}
w=1;
howmanysites=4; // How many sites are listed below&#63;
Sites = new makeArray(howmanysites);
Sites[1] = "http://www.jb51.net.com~JavaScript Planet|Hundreds of JavaScripts!";
Sites[2] = "http://www.baidu.com/dhtml~dHTML Scripts|Free dHTML Scripts!";
Sites[3] = "http://www.163.com~Altavista|The best search engine";
Sites[4] = "http://www.qq.com~Dynamic Drive|More dHTML Scripts";
function showSites() {
if (w > howmanysites) { w=1; };
var string=Sites[w] + "";
var split1=string.indexOf("~");
var split2=string.indexOf("|");
var url=string.substring(0,split1);
var name=string.substring(split1 + 1,split2);
var word=string.substring(split2 + 1,string.length);
document.form.url.value=url;
document.form.name.value=name;
document.form.word.value=word;
w+=1;
window.setTimeout('showSites()',3000);
}
function visitSite() {
window.location=document.form.url.value;
}
</SCRIPT>
<form name=form>
<table><tr><td align=center>
<input type=button name=name value="Visit" onClick="visitSite()" size=25>
<input type=hidden name=url value="">
<input type=text name=word value="" size=40>
</td></tr></table>
</form>
</center>
<script>
showSites();
</script>
</body>
</html>
Salin selepas log masuk

Saya harap artikel ini akan membantu pengaturcaraan JavaScript semua orang.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan