本文实例讲述了JS实现自动变化的导航菜单效果代码。分享给大家供大家参考。具体如下:
自动变化的JS导航菜单,按照时间自动切换,有需要的参考一下。
运行效果截图如下:
在线演示地址如下:
http://demo.jb51.net/js/2015/js-auto-cha-nav-menu-style-codes/
具体代码如下:
<!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"https://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>
希望本文所述对大家的JavaScript程序设计有所帮助。
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
暂无评论...
更新日志
2024年11月25日
2024年11月25日
- 凤飞飞《我们的主题曲》飞跃制作[正版原抓WAV+CUE]
- 刘嘉亮《亮情歌2》[WAV+CUE][1G]
- 红馆40·谭咏麟《歌者恋歌浓情30年演唱会》3CD[低速原抓WAV+CUE][1.8G]
- 刘纬武《睡眠宝宝竖琴童谣 吉卜力工作室 白噪音安抚》[320K/MP3][193.25MB]
- 【轻音乐】曼托凡尼乐团《精选辑》2CD.1998[FLAC+CUE整轨]
- 邝美云《心中有爱》1989年香港DMIJP版1MTO东芝首版[WAV+CUE]
- 群星《情叹-发烧女声DSD》天籁女声发烧碟[WAV+CUE]
- 刘纬武《睡眠宝宝竖琴童谣 吉卜力工作室 白噪音安抚》[FLAC/分轨][748.03MB]
- 理想混蛋《Origin Sessions》[320K/MP3][37.47MB]
- 公馆青少年《我其实一点都不酷》[320K/MP3][78.78MB]
- 群星《情叹-发烧男声DSD》最值得珍藏的完美男声[WAV+CUE]
- 群星《国韵飘香·贵妃醉酒HQCD黑胶王》2CD[WAV]
- 卫兰《DAUGHTER》【低速原抓WAV+CUE】
- 公馆青少年《我其实一点都不酷》[FLAC/分轨][398.22MB]
- ZWEI《迟暮的花 (Explicit)》[320K/MP3][57.16MB]