繁體中文当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 关于Blog顶部的滚动导航条代码
- Javascript
- javascript js cookie的存储,获取和删除
- 得到元素真实的背景颜色的js代码
- js获取url参数的使用扩展实例
- javascript 屏蔽鼠标键盘的几段代码
- 兼容IE FF Opera的javascript最短的拖动代码
- 创建一个复制UBB软件信息的链接或按钮的js代码
- js实现iframe动态调整高度的代码
- 浏览器无法运行JAVA脚本的解决方法
- js让弹出新窗口居中显示的脚本
- js常见表单应用技巧
- javascript 点击整页变灰的效果（可做退出效果）。
- 制作符合用户体验的漂亮的input输入框
- img的onload的另类用法
- 解读IE和firefox下JScript和HREF的执行顺序
- 用javascrpt将指定网页保存为Excel的代码
- 语义化 H1 标签
- JavaScript中Math对象使用说明
- JavaScipt基本教程之前言
- JavaScipt基本教程之JavaScript语言的基础
- JavaScipt对象的基本知识
Javascript 中的 关于Blog顶部的滚动导航条代码
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-12 浏览: 280 ::
收藏到网摘: 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
