<!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" /><script language=javascript src="http://www.0551jia.cn/js/jquery1.42.min.js"></script><title>测试</title><style type="text/css">* {color:#fff;}.clear { clear:both; height:0; line-height:0px; font-size:0;}#ding{position:fixed;z-index:100; background-color:#036; top:0;left:0;_position:absolute;_top:expression(documentElement.scrollTop + 0 + "px");_left:expression(documentElement.scrollLeft + 0 + "px");} #ding{width:100%;overflow:hidden; height:56px; text-align:center}.logo { background-color:#eee; height:70px; border-bottom:#d8d8d8 1px solid; margin-bottom:3px;}.navbox{ width:1100px; margin:0 auto; z-index:998;}.navboxfix{ position:fixed; left:50%; margin-left:-550px; width:1100px;top:56px; _position:relative;}.navbox {height:36px; line-height:36px; background-color:#484441; color:#FFF}.navbox dd a{display:block;width:134px; float:left; text-align:center; color:#fff}.k {height:800px; background-color:#069;}.b {height:800px; background-color:#393}</style></head><body><div id="ding"> 固定的顶 </div><div class="clear" style="height:56px;"></div><div class="logo wk cent"> 中间</div><div class="navbox"> <dl style="position:inherit"> <dd><a href="#kk1">这是1</a></dd> <dd><a href="#kk2">这是2</a></dd> <dd><a href="#kk3">这是3</a></dd> <dd><a href="#kk4">这是4</a></dd> <dd><a href="#kk5">这是5</a></dd> </dl></div><div class="k"><a name="kk1" id="kk1"></a>这是一</div><div class="b"><a name="kk2" id="kk2"></a>这是二</div><div class="k"><a name="kk3" id="kk3"></a>这是三</div><div class="b"><a name="kk4" id="kk4"></a>这是四</div><div class="k"><a name="kk5" id="kk5"></a>这是五</div><script type="text/javascript">var sft=$(".navbox").offset().top-56; //顶部固定DIV function shownav(){ var s_t= document.documentElement.scrollTop || document.body.scrollTop; if(s_t>sft){ $(".navbox").addClass("navboxfix") } else{ $(".navbox").removeClass("navboxfix") } }window.onscroll=shownav;</script></body></html>
回复讨论(解决方案)
参考:
offsetting an html anchor to adjust for fixed header
JQuery Position:Fixed 'NAVBAR' by scrolling the page
给锚点加上个下面的样式，纯css实现。
a.anchor{ display: block; position: relative; top: -92px; visibility: hidden;} 另外如果需要加上平滑滚动效果的话，可以点击查看
在线 演示结果
或者在线 演示代码
存贴备用， 实际效果地址
非常感谢您的热情回复！！！
参考:
offsetting an html anchor to adjust for fixed header
JQuery Position:Fixed 'NAVBAR' by scrolling the page
给锚点加上个下面的样式，纯css实现。
a.anchor{ display: block; position: relative; top: -92px; visibility: hidden;} 另外如果需要加上平滑滚动效果的话，可以点击查看
在线 演示结果
或者在线 演示代码
golang 报错：“undeclared name…” 如何解决？Jun 24, 2023 pm 03:31 PMGolang（Go编程语言）是一种基于C语言的编程语言，被广泛用于Web开发、网络编程、操作系统等领域。然而，在编写Golang程序时经常会遇到一个常见的问题，就是“undeclaredname”（未声明名称）错误。下面将介绍如何解决这个问题。了解错误信息在编译和运行Golang程序时，如果遇到了未声明名称错误，会在控制台输出相应的错误信
pagefile.sys占用太大怎么办Feb 20, 2024 am 09:01 AMpagefile.sys占用太大怎么办在使用电脑的过程中，我们经常会遇到内存不足的情况。为了解决这个问题，操作系统会将部分内存中的数据转移到磁盘上的一个特殊文件中，这个文件就是pagefile.sys。但有时候，我们会发现pagefile.sys文件的大小很大，占用了太多的磁盘空间。那么，我们该如何解决这个问题呢？首先，我们需要明确pagefile.sys文
Java中的ClassNotFoundException——找不到类要怎么解决？Jun 25, 2023 am 08:30 AMJava中的ClassNotFoundException是一种常见的编译错误。当我们尝试使用Java虚拟机（JVM）加载某个类时，如果JVM找不到该类，就会抛出ClassNotFoundException。这个错误可能出现在程序运行时，也可能出现在编译时。在本文中，我们将讨论什么是ClassNotFoundException，它为什么会发生以及如何解决它。C
jQuery如何移除元素的height属性？Feb 28, 2024 am 08:39 AMjQuery如何移除元素的height属性？在前端开发中，经常会遇到需要操作元素的高度属性的需求。有时候，我们可能需要动态改变元素的高度，而有时候又需要移除元素的高度属性。本文将介绍如何使用jQuery来移除元素的高度属性，并提供具体的代码示例。在使用jQuery操作高度属性之前，我们首先需要了解CSS中的height属性。height属性用于设置元素的高度
Java错误：JDBC错误，如何解决和避免Jun 24, 2023 pm 02:40 PM随着Java的广泛应用，Java程序在连接数据库时经常会出现JDBC错误。JDBC（JavaDatabaseConnectivity）是Java中用于连接数据库的编程接口，因此，JDBC错误是在Java程序与数据库交互时遇到的一种错误。下面将介绍一些最常见的JDBC错误及如何解决和避免它们。ClassNotFoundException这是最常见的JDBC
golang 编译错误："undefined: json.Marshal" 如何解决？Jun 24, 2023 pm 03:24 PMGo语言是一门越来越受欢迎的编程语言，它的简洁、高效、易于编写的特点已经被越来越多的开发者所认可。而在Go语言开发中，遇到编译错误是不可避免的。其中一个常见的错误就是“undefined:json.Marshal”。这个错误通常发生在你使用了Go标准库的“encoding/json”包时，编译器提示找不到“json.Marshal”的定义。这个问题的根本原
golang 报错：“undefined variable or function” 如何解决？Jun 24, 2023 pm 05:18 PMGo语言作为一门快速发展的编程语言，被广泛应用于各种项目和领域。然而，在使用golang编写程序时，你有可能会遇到一些报错，其中一个常见的报错是“undefinedvariableorfunction”。那么，这个错误是什么意思？它是如何产生的？又该如何解决呢？本文将会对这些问题进行探讨。首先，我们需要了解一些基本概念。在golang中，变量和函数是两
在Vue应用中遇到“SyntaxError: Unexpected token”怎么解决？Jun 24, 2023 pm 06:55 PM在Vue应用中遇到“SyntaxError:Unexpectedtoken”怎么解决？Vue是前端开发中广泛使用的一个JavaScript框架，它可以让我们更轻松地管理页面的状态、渲染和交互。但是在编写Vue应用时，有时会遇到“SyntaxError:Unexpectedtoken”报错，这个错误提示意味着代码中存在语法错误，JavaScript引擎
Hot AI Tools
Undresser.AI Undress
AI-powered app for creating realistic nude photos
AI Clothes Remover
Online AI tool for removing clothes from photos.
Undress AI Tool
Undress images for free
Clothoff.io
AI clothes remover
AI Hentai Generator
Generate AI Hentai for free.
Hot Article
Hot Tools
mPDF
mPDF is a PHP library that can generate PDF files from UTF-8 encoded HTML. The original author, Ian Back, wrote mPDF to output PDF files "on the fly" from his website and handle different languages. It is slower than original scripts like HTML2FPDF and produces larger files when using Unicode fonts, but supports CSS styles etc. and has a lot of enhancements. Supports almost all languages, including RTL (Arabic and Hebrew) and CJK (Chinese, Japanese and Korean). Supports nested block-level elements (such as P, DIV),
SublimeText3 Linux new version
SublimeText3 Linux latest version
Notepad++7.3.1
Easy-to-use and free code editor
PhpStorm Mac version
The latest (2018.2.1) professional PHP integrated development tool
Dreamweaver CS6
Visual web development tools
