// 菜单固定
$(function(){
//获取要定位元素距离浏览器顶部的距离
var navH = $("#topp").offset().top;
//滚动条事件
$(window).scroll(function(){
//获取滚动条的滑动距离
var scroH = $(this).scrollTop();
//滚动条的滑动距离大于等于定位元素距离浏览器顶部的距离,就固定,反之就不固定
if(scroH>=navH){
$("#topp").css({"position":"fixed"});
}else if(scroH<navH){
$("#topp").css({"position":"relative"});
}
})
})

页面滚动,菜单固定到顶部

jquery页面滚动,菜单固定到顶部的更多相关文章

  1. jQuery页面滚动监听事件及高级效果插件

    jQuery页面滚动监听事件及高级效果插件 1. One Page scroll (只适用于上下焦点图)http://www.thepetedesign.com/demos/onepage_scrol ...

  2. jquery页面滚动显示浮动菜单栏锚点定位效果

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  3. jquery页面滚动到指定id

    //jquery页面滚动到指定id  $body = (window.opera) ? (document.compatMode == "CSS1Compat" ? $('html ...

  4. jquery 页面滚动到底部自动加载插件集合

    很多社交网站都使用无限滚动的翻页技术来提高用户体验,当你页面滑到列表底部时候无需点击就自动加载更多的内容.下面为你推荐 10 个 jQuery 的无限滚动的插件: 1. jQuery ScrollPa ...

  5. jquery 页面滚动tab自动定位,tab与内容对应

    直接上源码,基于jquery写的,可以直接跑起来. 原理是先计算出页面元素对应的高度.页面滚动时计算tab对应的高端区间,设置具体的tab.欢迎指正 下载地址 <!DOCTYPE html> ...

  6. Jquery当div超出页面时就固定到顶部否则跟随页面滚动

    $.fn.smartFloat = function () { var position = function (element) { var top = element.position().top ...

  7. [HTML/JS] JQuery 页面滚动回到顶部

    HTML: <html> <body> <div id="back-to-top" style="cursor:pointer; displ ...

  8. jQuery页面滚动右侧浮动导航切换

    体验效果:http://hovertree.com/texiao/jquery/49/ 效果图: 代码如下: <!DOCTYPE html> <html> <head&g ...

  9. Jquery页面滚动动态加载数据,页面下拉自动加载内容

    <!DOCTYPE=html> <html> <head> <script src="js/jquery.js" type="t ...

随机推荐

  1. QoS 测量 (目标,方法,协议)

    本文翻译自ITU-T的Technical Paper:<How to increase QoS/QoE of IP-based platform(s) to regionally agreed ...

  2. CSDN蒋涛:我为什么和王峰一起创办极客帮天使基金?

         i 黑马 记者:王静静 7月15日,i黑马在一家咖啡厅见到了CSDN创始人蒋涛,这位中国最大的程序猿社区的创始人,正在经营一份新事业,他和蓝港在线创始人王峰正式成立了天使基金"极客 ...

  3. 线性表 及Java实现 顺序表、链表、栈、队列

    数据结构与算法是程序设计的两大基础,大型的IT企业面试时也会出数据结构和算法的题目, 它可以说明你是否有良好的逻辑思维,如果你具备良好的逻辑思维,即使技术存在某些缺陷,面试公司也会认为你很有培养价值, ...

  4. 一行命令搞定VS2012无法安装cocos2d-x-2.1.4及创建跨平台项目(二)

    转自:http://blog.csdn.net/yangjingui/article/details/9418843 由于上次发了一个比较二的方法来解决VS2012无法安装cocos2d-x-2.1. ...

  5. 第十二天--Property List和NSUserDefaults

    转自:http://appleparty.diandian.com/post/2012-05-24/9098104219 Property List  (属性表) 定义:Property List文件 ...

  6. Use Spring Insight Developer to Analyze Code, Install it with Tomcat, and Extend it with Plugins--转载

    原文地址:http://www.tomcatexpert.com/blog/2012/12/05/use-spring-insight-developer-analyze-code-install-i ...

  7. LeetCode24 Swap Nodes in Pairs

    题意: Given a linked list, swap every two adjacent nodes and return its head. For example,Given 1-> ...

  8. 自定义uitableviewcell通过加上滑动手势进行删除对应的行。PS:用代理来实现

    #import <UIKit/UIKit.h> @class ZSDCustomCell; //协议 @protocol ZSDCustomCellDelegate <NSObjec ...

  9. [Java] webservice soap,wsdl 例子

    java 调用webservice的各种方法总结 现在webservice加xml技术已经逐渐成熟,但要真正要用起来还需时日!! 由于毕业设计缘故,我看了很多关于webservice方面的知识,今天和 ...

  10. webSocket开源框架:SocketRocket 简单的使用

    需要用到webSocket,所以搜集了一下使用方法, git下载地址:square/SocketRocket gitHUB 上没有看懂,就要 cocoaPod 导入了 socketRocket 导入这 ...