菜单栏始终浮动在顶部 js
//菜单栏始终浮动在顶部
var navH = $(".trade-tab-bot").offset().top;//获取要定位元素距离浏览器顶部的距离
//滚动条事件
$(window).scroll(function(){
//获取滚动条的滑动距离
var scroH = $(this).scrollTop();
//滚动条的滑动距离大于等于定位元素距离浏览器顶部的距离,就固定,反之就不固定
if(scroH>=navH){
$(".trade-tab-bot").css({"position":"fixed","top":0,"left":0, "z-index":102, "margin":"0 auto", "width":"100%"});
}else if(scroH<navH){
$(".trade-tab-bot").css({"position":"relative","margin":"0 auto"});
}
//console.log(scroH==navH);
});
菜单栏始终浮动在顶部 js的更多相关文章
- js让菜单栏一直悬浮在顶部,经典代码
js让菜单栏一直悬浮在顶部,经典代码 很简单,你只需要把下面代码放到js中:$(function(){ //获取要定位元素距离浏览器顶部的距离 var na ...
- web页面浮动回到顶部功能和浮动广告
实现测试浮动回到顶部 法一:用js实现<%@ Page Language="C#" AutoEventWireup="true" CodeBehind=& ...
- jQuery 顶部导航尾随滚动,固定浮动在顶部
jQuery 顶部导航尾随滚动.固定浮动在顶部 演示 XML/HTML Code <section> <article class="left"> < ...
- 弹性返回顶部JS代码
弹性返回顶部JS代码 弹性返回顶部JS代码点击下载
- 手机端网页返回顶部js代码
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...
- 一段简单的顶部JS广告
一段简单的顶部JS广告 <SCRIPT LANGUAGE="JavaScript"> ; ; images = new Array; images[] = new Im ...
- JS 菜单栏一直悬浮在顶部代码
只需要把下面代码放到js中: $(function(){ //获取要定位元素距离浏览器顶部的距离 var navH = $(".menu&quo ...
- gotoTop返回顶部 JS
方法: 1.首先在body添加一个标签,在一个页面添加,其它页面也会生效. <body> <a name="top"> 2.然后在页脚添加一个链接 < ...
- 返回顶部js
backToTop.js: (function () { var $backToTopEle = $('<div class="backToTop"></div& ...
随机推荐
- nginx 3.nginx+fastcgi
死磕nginx 3.nginx+fastcgi 互联网服务器有个非常典型的架构lamp(linux+apache+mysql+php),由于其开源和强大的兼容性而风靡一时,不过随着nginx的横空出世 ...
- eclipse中svn版本不兼容问题
eclipse中导入本地svn管理的Android项目 使用svn时弹出以下提示: org.apache.subversion.javahl.ClientException: Unsupported ...
- fastUtils学习
比传统java集合工具类速度更快 google的guava也新增了java容器新的功能,功能更加强大,参考文档:http://www.ibm.com/developerworks/cn/java/j- ...
- 向ASP.NET服务器控件中嵌入CSS资源
Step1:于[项目解决方案]中右键新建[ASP.NET服务器控件]项目 Step2:于项目中添加[Resources]文件夹,于该文件夹下添加[CSS文件] Step3:单击该CSS文件,并将[属性 ...
- (转)SVN详解
原文地址:http://www.weixingon.com/s/visualsvn+%E4%B8%AD%E6%96%87 1.几种代理管理工具的适用场景 A.如果你的项目是5-6人的小团队,那么使用V ...
- WPF 打开文件 打开路径对话框
WPF调用WinForm中的 OpenFileDialog 和 FolderBrowserDialog 来实现响应的功能 对应的引用程序集: using System.Windows.Forms; O ...
- cocoapods出现Diff: /../Podfile.lock: No such file or directory错误
第一种解决方法: 关闭Xcode,重新执行pod install,之后再重新打开Xcode运行. 第二种解决方法: 删除以下文件: xcworkspacePodfile.lockPods文件夹~/Li ...
- 《Linux内核分析》 week2作业-时间片轮转
一.基于时间片轮转调度代码的解读 代码结构主要由三个文件组成: 1.mypcb.h 2.myinterrupt.c 3.mymain.c 1.进程控制块(mypcb.h) /* CPU-specifi ...
- 删除所有ecshop版权和logo
前面我们已经讲过如何删除ecshop的版权,但是还有很多人不会,今天就详细的讲下如何删除所有ecshop版权和logo 前台部分: 1:去掉头部TITLE部分的ECSHOP演示站 Powered by ...
- sublime在Mac osx下安装z-codeing(即emmet)
sublime安装插件可以根据插件名称通过package control就可以很方便的安装好.但是sublime没有默认安装package control,所以我们必须先安装它. 安装package ...