编程 Javascript

jquery实现的导航固定效果

Posted in Javascript onApril 28, 2014

jquery实现的导航固定效果

1.jquery代码, .nav为导航的class
$(function(){ 
  $(window).scroll(function() {
 if($(window).scrollTop()>=250){
  $(".nav").addClass("fixedNav");
 }else{
  $(".nav").removeClass("fixedNav");
 } 
  });
});
2.CSS代码
.fixedNav{
 position:fixed;
 top:0px;
 left:0px;
 width:100%;
 z-index:100000;
 _position:absolute;
 _top:expression(eval(document.documentElement.scrollTop));
}
3.HTML代码
<div class="nav">
    <p>导航固定</p>
</div>

jquery实现的导航固定效果

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

Javascript 相关文章推荐

JS 无限级 Select效果实现代码(json格式)

Aug 30 Javascript

JavaScript DOM节点添加示例

Jul 16 Javascript

JavaScript禁止用户多次提交的两种方法

Jul 24 Javascript

AngularJS中directive指令使用之事件绑定与指令交互用法示例

Nov 22 Javascript

JS回调函数简单用法示例

Feb 09 Javascript

详解Vue生命周期的示例

Mar 10 Javascript

js实现图片懒加载效果

Jul 17 Javascript

关于js的三种使用方式（行内js、内部js、外部js）的程序代码

May 05 Javascript

vue两组件间值传递 $router.push实现方法

May 15 Javascript

使用JS监听键盘按下事件（keydown event）

Nov 07 Javascript

vue cli3.0打包上线静态资源找不到路径的解决操作

Aug 03 Javascript

利用 JavaScript 构建命令行应用

Nov 17 Javascript

网页右侧悬浮滚动在线qq客服代码示例

Apr 28 #Javascript

一个简单的jquery进度条示例

Apr 28 #Javascript

javascript处理表单示例(javascript提交表单)

Apr 28 #Javascript

js对象内部访问this修饰的成员函数示例

Apr 27 #Javascript

node.js中的socket.io入门实例

Apr 26 #Javascript

jquery鼠标放上去显示悬浮层即弹出定位的div层

Apr 25 #Javascript

js控制容器隐藏出现防止样式变化的两种方法

Apr 25 #Javascript

You might like

PHP输出控制功能在简繁体转换中的应用

2006/10/09 PHP

php开启与关闭错误提示适用于没有修改php.ini的权限

2014/10/16 PHP

标准版Eclipse搭建PHP环境的详细步骤

2015/11/18 PHP

Symfony2创建页面实例详解

2016/03/18 PHP

Centos6.5和Centos7 php环境搭建方法

2016/05/27 PHP

Thinkphp事务操作实例(推荐)

2017/04/01 PHP

javascript Error 对象错误处理

2008/05/18 Javascript

豆瓣网的jquery代码实例

2008/06/15 Javascript

jsp+javascript打造级连菜单的实例代码

2013/06/14 Javascript

js过滤特殊字符输入适合输入、粘贴、拖拽多种情况

2014/03/22 Javascript

Extjs的FileUploadField文件上传出现了两个上传按钮

2014/04/29 Javascript

Jquery代码实现图片轮播效果（一）

2015/08/12 Javascript

jQuery div拖拽用法实例

2016/01/14 Javascript

Javascript打印局部页面实例

2016/06/21 Javascript

由浅入深剖析Angular表单验证

2016/07/14 Javascript

AngularJS+Bootstrap实现多文件上传与管理

2016/11/08 Javascript

vue2.0开发实践总结之疑难篇

2016/12/07 Javascript

jQuery鼠标移动图片上实现放大效果

2017/06/25 jQuery

JSON对象转化为字符串详解

2017/08/11 Javascript

详解Node.js中的Async和Await函数

2018/02/22 Javascript

详解javascript中的变量提升和函数提升

2018/05/24 Javascript

使用webpack3.0配置webpack-dev-server教程

2018/05/29 Javascript

python原始套接字编程示例分享

2014/02/21 Python

在python中bool函数的取值方法

2018/11/01 Python

Python2与Python3的区别实例分析

2019/04/11 Python

python求一个字符串的所有排列的实现方法

2020/02/04 Python

Python数组拼接np.concatenate实现过程

2020/04/18 Python

python如何使用代码运行助手

2020/07/03 Python

浅析HTML5 Landmark

2020/09/11 HTML / CSS

全球最大的在线旅游公司：Expedia

2017/11/16 全球购物

纽约香氛品牌：NEST Fragrance

2018/10/15 全球购物

Servlet的生命周期

2013/08/25 面试题

工作作风承诺书

2014/08/30 职场文书

电影圆明园观后感

2015/06/03 职场文书

优秀乡村医生事迹材料（2016精选版）

2016/02/29 职场文书

springcloud之Feign超时问题的解决

2021/06/24 Java/Android