scroll 滚动条 长话短说进入正题：

scrollTOP==0 内容置于顶部；

scrollTOP()>=$(document).height-$(window).height 内容置于底部

之后我写了一个效果，在鼠标滚动120像素时，content层显示，小于120像素，content层隐藏

<!--html-->

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script class="jquery library" src="jquery/jquery-1.8.2.min.js" type="text/javascript"></script>
<title>对联广告</title>
</head>
<body style="height:1000px;">
<div class="content">
</div>
</body>
</html>

<!--css-->

*{margin:0;padding:0;}

.content{width:200px;height:400px;background:#fff;display:none;position:fixed;left:0;top:30px;_position:absolute;_top:expression((offsetParent.srollTop)+0);_left:expression((offsetParent.scrollLeft)+0);z-index:999;}

<!--js-->

window.onscroll=function(){
var t=document.documentElement.scrollTop||document.body.scrollTop
if(t>120){
$(".content").fadeIn();
}else{
$(".content").fadeOut();
}
}

scroll运用、图片悬浮的更多相关文章

  1. JS-特效 ～ 02. 屏幕滚动事件、 DTD、scroll、顶部悬浮导航、两侧跟随广告、返回顶部小火煎

    ceil 向上取整 floor 向下取整 round 四舍五入 缓动动画 动画原理 = 盒子位置 + 步长 清除定时器 步长越来越小 盒子位置 = 盒子本身位置 + (目标位置-本身位置)/n(最好为 ...

  2. css-transition和transform实现图片悬浮移动动画

    今天在京东首页上看到一个效果,鼠标悬浮在图片上时,图片发生移动,鼠标移走时再移回,并且有一个过渡效果. 貌似很简单,自己做做试试吧 我首先使用的是jquery在鼠标悬浮到图片上给图片增加一个类,这个类 ...

  3. Dynamics CRM 自定义上传附件的图片悬浮层显示

    CRM中的附件是以流的形式保存在了数据库中,这样做的一个坏处是一旦系统运行时间久,附件上传的多了势必会导致数据库极速扩大,即影响系统的运行效率也对后期的迁移维护带来了不必要的麻烦.所以很多的客户都会要 ...

  4. CSS3 图片悬浮缩放效果

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  5. 自定义jq插件，鼠标悬浮展示图片或者视频放大图，可自定义展示内容

    网站项目经常会遇到一些视频或者图片素材的展示功能,那么就需要自己写一个功能,就是在一些列表页面你想要是这个数据的详细内容,弹框在页面某个位置 例如这是视频悬浮展示效果,可自定义自动播放等属性标签 又例 ...

  6. CSS3 background-image背景图片相关介绍

    这里将会介绍如何通过background-image设置背景图片,以及背景图片的平铺.拉伸.偏移.设置大小等操作. 1. 背景图片样式分类 CSS中设置元素背景图片及其背景图片样式的属性主要以下几个: ...

  7. CSS背景颜色、背景图片、平铺、定位、固定

    CSS背景颜色设置 background-color:red;如设置背景颜色为红色: 背景颜色设置支持3种写法: 颜色名 16进制 rgb CSS背景图片颜色设置 background-image:u ...

  8. CSS background-image背景图片相关介绍

    这里将会介绍如何通过background-image设置背景图片,以及背景图片的平铺.拉伸.偏移.设置大小等操作. 1. 背景图片样式分类 CSS中设置元素背景图片及其背景图片样式的属性主要以下几个: ...

  9. css简单的一些基础知识

    css层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言.CSS不仅可 ...

随机推荐

  1. 由WSDL文件生成WEB service server端C#程序（转）

    一般一个已经实现功能的WEB Server会发布自己的WSDL文件,供客户端生成代理类. 但有时是先有的server与client交互的接口定义(WSDL)文件,然后由server和client端分别 ...

  2. 获取电脑cpu的使用情况

    using System; using System.Diagnostics; namespace ConsoleApplication1 { class Program { static void ...

  3. vi常用操作命令

    进入vi的命令 vi filename :打开或新建文件,并将光标置于第一行首 vi +n filename :打开文件,并将光标置于第n行首 vi + filename :打开文件,并将光标置于最后 ...

  4. SQL Server 查看表定义的 2 种方法

    方法 1. 用SQL Server Management Studio 第一步找到要查看的表,右键 第二步点设计 方法 2. sp_help @objname = 'tableName' execut ...

  5. Nginx 配置指令的执行顺序（一）

    大多数 Nginx 新手都会频繁遇到这样一个困惑,那就是当同一个 location 配置块使用了多个 Nginx 模块的配置指令时,这些指令的执行顺序很可能会跟它们的书写顺序大相径庭.于是许多人选择了 ...

  6. vs2005的MFC程序在64位机上不能运行

    出现上述错误大多因为该机上没有安装vs2005程序,vs2005要运行需要一些必要的文件,没有添加到你发布的可执行文件目录下,所以程序不能运行. 解决方法: 安装目录\Microsoft Visual ...

  7. PM产品经理练级攻略（1-5等级）

    大家都叫“PM”,但做的事情却完全不同? “PM”这个词到底是什么意思? 这个话题恐怕也是各位同行都一直在想,也一直想不清楚的吧,我也是. 每次看到各种“产品经理的能力模型”,我都觉得有点扯淡,总觉得 ...

  8. jQuery.each(object, [callback])方法，用于处理json数组

    通用例遍方法,可用于例遍对象和数组. 不同于例遍 jQuery 对象的 $().each() 方法,此方法可用于例遍任何对象.回调函数拥有两个参数:第一个为对象的成员或数组的索引,第二个为对应变量或内 ...

  9. 2014第8周三杂记及web标准学习

    昨天遇到一个问题,安卓中mp3默认打开方式的设置,本来如果直接用播放器来查找文件打开没问题,但不知为何播放器只能在历史文件夹中查找,那么在ES文件管理器中找到对应mp3文件后却总是被默认的ES播放器打 ...

  10. [Leetcode][Python]53: Maximum Subarray

    # -*- coding: utf8 -*-'''__author__ = 'dabay.wang@gmail.com' 53: Maximum Subarrayhttps://leetcode.co ...