编程 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 相关文章推荐

一句话JavaScript表单验证代码

Aug 02 Javascript

javascript实现促销倒计时+fixed固定在底部

Sep 18 Javascript

Javascript实现的常用算法（如冒泡、快速、鸽巢、奇偶等）

Apr 29 Javascript

Javascript中的五种数据类型详解

Dec 26 Javascript

Node.js开发之访问Redis数据库教程

Jan 14 Javascript

js判断文本框输入的内容是否为数字

Dec 23 Javascript

倾力总结40条常见的移动端Web页面问题解决方案

May 24 Javascript

js 毫秒转天时分秒的实例

Nov 17 Javascript

小程序实现列表删除功能

Oct 30 Javascript

微信小程序中的canvas 文字断行和省略号显示功能的处理方法

Nov 14 Javascript

vue服务端渲染操作简单入门实例分析

Aug 28 Javascript

JS实现点星星消除小游戏

Mar 24 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