编程 Javascript

导航跟随滚动条置顶移动示例代码

Posted in Javascript onSeptember 11, 2013

#topmenu{position:absolute;top:100px;background:#4b4a4a;width:100%;margin:0 auto;clear:both;overflow:hidden;z-index:998;left:0} <script type="text/javascript"> 
jQuery(document).ready(function() { 
var topmenu = jQuery("#topmenu"); 
var topmenu_top = topmenu.offset().top; 
reset_topmenu_top(topmenu, topmenu_top); 
jQuery(window).scroll(function() { 
reset_topmenu_top(topmenu, topmenu_top); 
}); 
}); 
function reset_topmenu_top(topmenu, topmenu_top) { 
var document_scroll_top = jQuery(document).scrollTop(); 
if (document_scroll_top > topmenu_top) { 
topmenu.css('top', document_scroll_top); 
} 
if (document_scroll_top <= topmenu_top) { 
topmenu.css('top', topmenu_top); 
} 
} 
</script>

效果图如下：

导航跟随滚动条置顶移动示例代码

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JavaScript 用cloneNode方法克隆节点的代码

Oct 15 Javascript

如何动态的导入js文件具体该怎么实现

Jan 14 Javascript

jQuery循环滚动新闻列表示例代码

Jun 17 Javascript

基于Jquery和CSS3制作数字时钟附源码下载(CSS3篇)

Nov 24 Javascript

实例详解jQuery结合GridView控件的使用方法

Jan 04 Javascript

jQuery实现横向带缓冲的水平运动效果(附demo源码下载)

Jan 29 Javascript

BootStrap Fileinput的使用教程

Dec 30 Javascript

解决微信内置浏览器返回上一页强制刷新问题方法

Feb 05 Javascript

webpack实用小功能介绍

Jan 02 Javascript

JS基于for语句编写的九九乘法表示例

Jan 04 Javascript

vue 保留两位小数不能直接用toFixed(2) 的解决

Aug 07 Javascript

在JavaScript中查找字符串中最长单词的三种方法(推荐)

Jan 18 Javascript

查找iframe里元素的方法可传参

Sep 11 #Javascript

Jquery 的outerHeight方法使用介绍

Sep 11 #Javascript

$.get获取一个文件的内容示例代码

Sep 11 #Javascript

JQuery触发事件例如click

Sep 11 #Javascript

自动设置iframe大小的jQuery代码

Sep 11 #Javascript

jquery 倒计时效果实现秒杀思路

Sep 11 #Javascript

Jquery 跨域访问 Lightswitch OData Service的方法

Sep 11 #Javascript

You might like

PHP概述.

2006/10/09 PHP

php+ajax导入大数据时产生的问题处理

2014/06/11 PHP

php计算整个mysql数据库大小的方法

2015/06/19 PHP

老生常谈php 正则中的i,m,s,x,e分别表示什么

2017/03/02 PHP

获取HTML DOM节点元素的方法的总结

2009/08/21 Javascript

jQuery.query.js 取参数的两点问题分析

2012/08/06 Javascript

js拖拽一些常见的思路方法整理

2014/03/19 Javascript

require.js深入了解 require.js特性介绍

2014/09/04 Javascript

js跨浏览器的事件侦听器和事件对象的使用方法

2015/12/17 Javascript

基于Bootstrap实现图片轮播效果

2016/05/22 Javascript

jQuery实现动态添加tr到table的方法

2016/12/26 Javascript

详谈jQuery Ajax(load,post,get,ajax)的用法

2017/03/02 Javascript

bootstrap表单示例代码分享

2017/05/18 Javascript

利用Node.js检测端口是否被占用的方法

2017/12/07 Javascript

详解vue-router 命名路由和命名视图

2018/06/01 Javascript

[07:26]2015国际邀请赛第二日TOP10集锦

2015/08/06 DOTA

python人人网登录应用实例

2014/09/26 Python

Python 的 Socket 编程

2015/03/24 Python

python随机生成指定长度密码的方法

2015/04/04 Python

python实现文件路径和url相互转换的方法

2015/07/06 Python

Python中的Descriptor描述符学习教程

2016/06/02 Python

听歌识曲--用python实现一个音乐检索器的功能

2016/11/15 Python

Pandas读写CSV文件的方法示例

2019/03/27 Python

Python使用crontab模块设置和清除定时任务操作详解

2019/04/09 Python

Python自定义一个异常类的方法

2019/06/27 Python

Django框架视图介绍与使用详解

2019/07/18 Python

Python MongoDB 插入数据时已存在则不执行，不存在则插入的解决方法

2019/09/24 Python

对python中各个response的使用说明

2020/03/28 Python

django 多数据库及分库实现方式

2020/04/01 Python

简述synchronized和java.util.concurrent.locks.Lock的异同

2014/12/08 面试题

2014年公路养护工作总结

2014/12/04 职场文书

2014年卫生监督工作总结

2014/12/09 职场文书

2015建军节87周年演讲稿

2015/03/19 职场文书

SQL Server 数据库实验课第五周——常用查询条件

2021/04/05 SQL Server

mysql 带多个条件的查询方式

2021/06/05 MySQL

JavaScript 中for/of,for/in 的详细介绍

2021/11/17 Javascript