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>
Javascript 相关文章推荐
jquery ready函数源代码研究
Dec 06 Javascript
整理一些JavaScript的IE和火狐的兼容性注意事项
Mar 17 Javascript
线路分流自动智能跳转代码,自动选择最快镜像网站(js)
Oct 31 Javascript
javascript模拟评分控件实现方法
May 13 Javascript
浅谈bootstrap源码分析之scrollspy(滚动侦听)
Jun 06 Javascript
基于css3新属性transform及原生js实现鼠标拖动3d立方体旋转
Jun 12 Javascript
jQuery grep()方法详解及实例代码
Oct 30 Javascript
Bootstrap3 内联单选和多选框
Dec 29 Javascript
JavaScript判断浏览器及其版本信息
Jan 20 Javascript
JavaScript通过filereader接口读取文件
May 10 Javascript
基于Vue实例生命周期(全面解析)
Aug 16 Javascript
ES6中数组array新增方法实例总结
Nov 07 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 Ajax实现页面无刷新发表评论
2007/01/02 PHP
网友原创的PHP模板类代码
2008/09/07 PHP
php中将图片gif,jpg或mysql longblob或blob字段值转换成16进制字符串
2011/08/23 PHP
php中3种方法统计字符串中每种字符的个数并排序
2012/08/27 PHP
php基于jquery的ajax技术传递json数据简单实例
2016/04/15 PHP
PHP获取指定日期是星期几的实现方法
2016/11/30 PHP
PHP从零开始打造自己的MVC框架之入口文件实现方法详解
2019/06/03 PHP
根据地区不同显示时间的javascript代码
2007/08/13 Javascript
JavaScript入门学习书籍推荐
2008/06/12 Javascript
jQuery中clearQueue()方法用法实例
2014/12/29 Javascript
jQuery动画显示和隐藏效果实例演示(附demo源码下载)
2015/12/31 Javascript
Nodejs获取网络数据并生成Excel表格
2020/03/31 NodeJs
Javascript实现图片不间断滚动的代码
2016/06/22 Javascript
基于vue.js快速搭建图书管理平台
2017/10/29 Javascript
js时间戳与日期格式之间相互转换
2017/12/11 Javascript
JavaScript中arguments和this对象用法分析
2018/08/08 Javascript
Vue props 单向数据流的实现
2018/11/06 Javascript
使用express获取微信小程序二维码小记
2019/05/21 Javascript
python将多个文本文件合并为一个文本的代码(便于搜索)
2011/03/13 Python
利用Python脚本在Nginx和uwsgi上部署MoinMoin的教程
2015/05/05 Python
Python自动化运维和部署项目工具Fabric使用实例
2016/09/18 Python
对python字典元素的添加与修改方法详解
2018/07/06 Python
numpy:np.newaxis 实现将行向量转换成列向量
2019/11/30 Python
Python 序列化和反序列化库 MarshMallow 的用法实例代码
2020/02/25 Python
Python中openpyxl实现vlookup函数的实例
2020/10/28 Python
使用CSS3的rem属性制作响应式页面布局的要点解析
2016/05/24 HTML / CSS
CSS3中的弹性布局em运用入门详解 1em等于多少像素
2021/02/08 HTML / CSS
仓库管理专业个人自我评价范文
2013/11/11 职场文书
如何客观的进行自我评价
2013/12/17 职场文书
学生周末长期请假条
2014/02/15 职场文书
2014年最新党员对照检查材料汇总
2014/09/15 职场文书
个人房屋买卖协议书(范本)
2014/10/04 职场文书
邀请函样本
2015/02/02 职场文书
2016年青少年禁毒宣传教育活动总结(学校)
2016/04/05 职场文书
解决Pytorch半精度浮点型网络训练的问题
2021/05/24 Python
Win11 Build 22000.51版本文件资源管理器“命令栏”和上下文菜单有什么新变化?
2021/11/21 数码科技