Jquery几行代码解决跟随屏幕滚动DIV
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jquery.text-effects</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style>
#test
{
position: absolute;
top: 10px;
right: 10px;
width: 130px;
height: 60px;
background: #555;
color: #fff;
font-size: 13px;
}
</style>
<script src="http://img.jb51.net/jslib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
<script language="javascript">
$(document).ready(function () {
var menuYloc = $("#test").offset().top;
$(window).scroll(function () {
var offsetTop = menuYloc + $(window).scrollTop() + "px";
$("#test").animate({ top: offsetTop }, { duration: 600, queue: false });
});
});
</script>
</head>
<body>
<h1>7行代码的跟随屏幕滚动层.</h1>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<div id="test">Dev By CssRain.cn<br/>Test ie6+,firefox3.0</div>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
</body>
</html>
Jquery几行代码解决跟随屏幕滚动DIV的更多相关文章
- 跟随屏幕滚动层、遮罩层、获取Div相对定位、整个屏幕、html文档的jquery基本操作
一.层跟随屏幕滚动 <div style="width:120px;height:120px;border:1px solid red; position:absolute; left ...
- 代码优化实战,3行代码解决了一百个if else!
事情是这样的,前段时间做代码review的时候,发现项目中有一个方法代码量超鸡儿多,而且大部分都是写的参数校验的代码,得,我们先抓着缕一缕需求先. 产品需求 找到产品要到了需求文档,需求是这样得: e ...
- 解决 scroll() position:fixed 抖动、导航菜单固定头部(底部)跟随屏幕滚动
一.导航栏或者页脚正常情况下固定在页面的相应位置,当页面滚动后,导航栏或者页脚固定在页面的顶部或者底部的情景 一般就是将该块的代码样式的position设置为fixed.固定在顶部的话,将top设置为 ...
- 7行代码解决P1441砝码称重(附优化过程)
先贴上最终代码感受一下: #include <bits/stdc++.h> using namespace std; int i, N, M, wi[21], res = 0; int m ...
- Asp.Net Core-几行代码解决Razor中的嵌套if语句
MVC开发中,经常会遇到在razor中插入简单的逻辑判断. @if (clientManager.IsAdmin) { if (!Model.Topic.Top) { <a asp-action ...
- 17行代码解决微信小程序图片延迟加载
js 页面 Page({ data: { realScrollTop: 0,//页面滚动距离 driveHeight //屏幕高度可初始化设置 }, scroll(e){ if(e.detail.sc ...
- 八行代码解决八皇后问题(c++)
说的有点夸装,实际上并不只是巴航代码,加上前面的变量声明之类的一共有40多行的样子吧,好像是在知乎上看到的,现在有时间再把它写下来: 其中用到了一些c++11特性,例如lambda 以及给予范围的 f ...
- Swift几行代码解决UITableView空数据视图问题
tableView空数据问题 一般项目中tableView若数据为空时会有一个提示示意图 为了更好的管理这种提示示意图,笔者利用extension进行了简单的拓展 解决思路 利用swift面向协议的特 ...
- 6行代码解决golang TCP粘包
转自:https://studygolang.com/articles/12483 什么是TCP粘包问题以及为什么会产生TCP粘包,本文不加讨论.本文使用golang的bufio.Scanner来实现 ...
随机推荐
- 记一次wiki数据爬取过程
最近有个爬取各国领导人信息的奇怪需求,要求百度和维基两种版本的数据,最要命的还要保持数据的结构不变.正好印象中隐约记得维基有专门的领导人列表页,不考虑爬取下来的格式不变的话应该很好爬的样子. 首先思路 ...
- 32位汇编第三讲,RadAsm,IDE的配置和使用,以及汇编代码注入方式
32位汇编第三讲,RadAsm,IDE的配置和使用,以及汇编代码注入方式 一丶RadAsm的配置和使用 用了怎么长时间的命令行方式,我们发现了几个问题 1.没有代码提醒功能 2.编写代码很慢,记不住各 ...
- 计算理论:NFA转DFA的两种方法
本文将以两种方法实现NFA转DFA,并利用C语言实现. 方法二已利用HNU OJ系统验证,方法一迷之WA,但思路应该是对的,自试方案,测试均通过. (主要是思路,AC均浮云,大概又有什么奇怪的Case ...
- CCIE-交换路由复习笔记
交换 考点: 1.trunk link(基础) 2.vtp 3.vlan 4.stp rstp mstp 5.hsrp vrrp glbp 6.ec Trunk link: 修改封装模式 802.1q ...
- 全面解析for循环
牛刀小试: for(var i = 0 ; i < 100; i++) {console.log(i);} var i = 0;//第一个代码段 i < 100; //第二个代码段 i++ ...
- Mac Intellij Debug 模式
前言:本文的核心是记录debug的使用,与具体的操作系统无关. 1.什么是Debug Debug是程序的一种运行模式.用来发掘程序的走向,以及程序在运行过程中参数的变化. 2.Debug的作用 deb ...
- Java课程设计—学生成绩管理系统(54号童欢)
1. 团队课程设计博客链接 http://www.cnblogs.com/wufuckshuo/p/7063183.html 2.个人责模块或任务说明 负责模块/任务:主函数(调用其他的功能函数),添 ...
- Java:extends和implements的区别+用法
Java代码中的extends和implements让我感到很迷惑,现在终于弄明白它们之间的区别和用法了. [c-sharp] view plain copy //定义一个Runner接口 publi ...
- MySQL集群(一)之主从复制
前面学完了JDBC,接下来带大家感受一下MySQL集群!其实什么是MySQL集群?简单的说就是一群机器(服务器)的集合,它们连在一起来工作. 其实各种数据库都有自己的集群,常常的多: 我们要学习的就是 ...
- sqlserver2012 密码过期问题
昨天登录系统突然连不上数据库了看了看报错内容提示是sqlserver的用户密码过期,那么就简单记录下操作,方便孩子后解决 (1)首先打开sql Management Studio 2012 顺便提一下 ...