吸顶盒

#nav.fixed{
position:fixed;
border:1px solid blue;
top:0;
}

$(function(){
var navTop = $("#nav").offset().top;
//alert( navTop )
$(window).scroll(function(){
var scrollTop = $(document).scrollTop();

if ( scrollTop >= navTop )
{
$("#nav").addClass("fixed");
}else{
$("#nav").removeClass("fixed");
}
});
})

时间: 2024-10-27 14:12:06

吸顶盒的相关文章

better-scroll之吸顶效果巨坑挣扎中

今天和大家分享下better-scroll这款移动端用来解决各种滚动需求的插件(目前已经支持PC) 关于其中的API大家可以去官网看下  这里就给大家介绍几种常用的以及需要注意的点是什么 首先说一下better-scroll的使用注意问题吧 1.移动端 我们通常采用三段式进行布局的  例如 <div class="container">    <header></header><main></main><fotter&g

代码:jquery 吸顶 效果

(只是个简单吸顶效果,还需完善) 吸顶: <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $(window).scroll( function() { var m =$(document).scrollTop(); console.log(

status bar、navigationBar、tableView吸顶view设置

1. 隐藏navigationBar self.navigationController.navigationBar.hidden = YES; 2. status bar设置 -(void)viewDidAppear:(BOOL)animated { [super viewDidAppear:animated]; [UIApplication sharedApplication].statusBarStyle = UIStatusBarStyleLightContent; } -(void)v

原生js吸顶式导航条

<!--吸顶式导航条--><nav class="nav"> <div> <a href="javascript: return false"><img src="n.jpg" ></a> <div class="topNav"> <div> <input type="text" placeholder=&

吸顶式和天馈式无线覆盖的区别和应用

在企业无线网络应用中,常用的无线覆盖方式有,吸顶式无线AP和天馈式无线覆盖,简单分析一下两种覆盖方案的区别和优缺点.方式一:天馈式覆盖    天馈式覆盖是用一个工业级无线AP接多个吸顶天线,AP和天线用馈线连接,称为天馈式.工业级无线AP也称为"胖AP"或大功率无线AP,无线信号强,接入人数多. 方式二:吸顶式无线AP    整个覆盖区域安装多个吸顶式无线AP,称为吸顶式.吸顶式AP已经内置天线,每隔一段距离安装一个AP,AP用网线连接至机房.吸顶式无线AP也称为"瘦AP&q

原生js实现吸顶导航和回到顶部特效

1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>吸顶导航特效</title> 6 <style type="text/css"> 7 body{ 8 margin: 0; 9 padding: 0; 10 } 11 .main{ 12 width: 10

js实现导航栏的吸顶操作

1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 2 3 4 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 5 <html> 6 <head> 7 <style type="text/css&

ECSTORE导航吸顶功能

ecstore导航吸顶功能,在导航父元素中加入id,如: 1 <div id="mainNav1"></div> 在footer.html中添加以下js代码: 1 <script type="text/javascript">function getTop(e) 2 { 3 var offset=e.offsetTop; 4 if(e.offsetParent!=null) //只要还有父元素,也就是当前元素不是根节点就继续往上累

移动端吸顶(iOS与安卓)

有的时候经常会遇到移动端吸顶效果,开始我也只是上网查了一下,分别有iOS和android两种样式,如下: /*!*Android*!*/ .head { position: fixed; top: 0; left: 0; z-index: 5; } /*!*iOS*!*/ .head{ position: -webkit-sticky; position: sticky; top: 0; left: 0; z-index: 5; } 设置之后你会发现只有ios手机的吸顶效果OK了,android