繁體中文当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 关于Blog顶部的滚动导航条代码
- Javascript
- JavaScript 仿歌词效果
- javascript 网页上跳动的文字
- jquery 屏蔽一个区域内的所有元素，禁止输入
- VBScript 实现文字遮罩
- 用按钮触发Javascript动态生成一个表格的代码
- 文字瞬间从左到右切换显示的JavaScript代码
- jquery 插件开发方法小结
- JS 操作日期 顺便实现 上一周 和 下一周 功能
- struts2 jquery 打造无限层次的树
- js文件中调用js的实现方法小结
- 写入cookie的JavaScript代码库 cookieLibrary.js
- LazyForm jQuery plugin 定制您的CheckBox Radio和Select
- javascript Keycode对照表
- JavaScript 动态添加表格行 使用模板、标记
- JS window.opener返回父页面的应用
- JavaScript 高仿真可控弹簧振子实现代码
- 利用JQuery+EasyDrag 实现弹出可拖动的Div，同时向Div传值，然后返回Div选中的值
- JavaScript 图片放大效果及代码说明
- js 操作符实例代码
- JavaScript 文本域字体大小选择功能
Javascript 中的 关于Blog顶部的滚动导航条代码
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-12 浏览: 135 ::
收藏到网摘: n/a
不少朋友通过各种方式问我要 Blog 顶部的滚动导航菜单的代码。其实也没什么特别的，但既然有需求，我就还是把这部分代码整理出来，供大家参考。
复制代码 代码如下:
<!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>
<TITLE>Float Div</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
#zealNavigatorBar {
position: absolute;
z-index: 100;
width: 760px;
height: 32px;
line-height: 32px;
top: 0px;
left: 0px;
padding: 0px;
margin: 0px;
border-bottom:1px solid #646465;
background-color: #C0C0C3;
}
</style>
</HEAD>
<BODY>
<div id=zealNavigatorBar>
<a href="/">Anything here</a>
<a href="/">Anything here</a>
<a href="/">Anything here</a>
</div>
<script language="JavaScript">
for(var t=0;t<1000;t++) document.writeln('Test content: line '+t+'<br />');
</script>
<script language="JavaScript">
var g_myBodyInstance = document.body;
var g_myBodyInstanceString = "document.body";
if(document.compatMode != "BackCompat"){
// for looser.dtd
g_myBodyInstance = document.documentElement;
g_myBodyInstanceString = "document.documentElement";
}
var isMinNS4 = (navigator.appName.indexOf("Netscape") >= 0 &&
parseFloat(navigator.appVersion) >= 4) ? 1 : 0;
var isMinNS5 = (navigator.appName.indexOf("Netscape") >= 0 &&
parseFloat(navigator.appVersion) >= 5) ? 1 : 0;
var isMinIE4 = (document.all) ? 1 : 0;
var isMinIE5 = (isMinIE4 && navigator.appVersion.indexOf("5.") >= 0) ? 1 : 0;
var isMacIE = (isMinIE4 && navigator.userAgent.indexOf("Mac") >= 0) ? 1 : 0;
var getFFVersion=navigator.userAgent.substring(
navigator.userAgent.indexOf("Firefox")).split("/")[1];
//extra height in px to add to iframe in FireFox 1.0+ browsers
var FFextraHeight=getFFVersion<1.5? 16 : 0;
function getLayer(name) {
if (isMinNS5)
return document.getElementById(name);
else if (isMinIE4)
return eval('document.all.' + name);
else if (isMinNS4)
return findLayer(name, document);
return null;
}
function findLayer(name, doc) {
var i, layer;
for (i = 0; i < doc.layers.length; i++) {
layer = doc.layers[i];
if (layer.name == name)
return layer;
if (layer.document.layers.length > 0) {
layer = findLayer(name, layer.document);
if (layer != null)
return layer;
}
}
return null;
}
function moveLayerTo(layer, x, y) {
if (isMinIE4) {
layer.style.left = x;
layer.style.top = y;
}
else if (isMinNS5) {
layer.style.left = x+'px';
layer.style.top = y+'px';
}
else if (isMinNS4)
layer.moveTo(x, y);
}
function getPageLeft(layer) {
if (isMinIE4||isMinNS5)
return(layer.offsetLeft);
else if (isMinNS4)
return(layer.pageX);
return(-1);
}
function getPageTop(layer) {
if (isMinIE4||isMinNS5)
return(layer.offsetTop);
else if (isMinNS4)
return(layer.pageY);
return(-1);
}
function getPageScrollX() {
if (isMinIE4||isMinNS5)
return(g_myBodyInstance.scrollLeft);
else if (isMinNS4)
return(window.pageXOffset);
return(-1);
}
function getPageScrollY() {
if (isMinIE4||isMinNS5)
return(g_myBodyInstance.scrollTop);
else if (isMinNS4)
return(window.pageYOffset);
return(-1);
}
var g_p_zealNavigatorBar = null;
g_p_zealNavigatorBar = getLayer('zealNavigatorBar');
if(!isMinIE4){g_p_zealNavigatorBar.style.position = 'fixed';}
function reposzealNavigatorBar(){
if(isMinIE4){
try{
moveLayerTo(g_p_zealNavigatorBar,
getPageLeft(g_p_zealNavigatorBar),
getPageScrollY());
}catch(e){}
}
}
window.onresize = reposzealNavigatorBar;
window.onscroll = reposzealNavigatorBar;
window.onload = reposzealNavigatorBar;
</script>
</BODY>
</HTML>
评论 (0) All
