直接入题!

当内容页比较长的时候,网站右侧一直是空白,不如放点有用的东西给用户看,最好不要放广告,因为那样很邪恶,你懂的。

好吧,昨天写了这个东西,jQuery滚动随动区块,代码如下:

//侧栏随动
var rollStart = $('.feed-mail'), //滚动到此区块的时候开始随动
rollOut = $('.cookie-list'); //隐藏rollStart之后的区块 rollStart.before('<div class="da_rollbox"></div>'); var offset = rollStart.offset(),objWindow = $(window),rollBox = rollStart.prev(),
rollSet = $('.search,.weibo,.group'); //添加rollStart之前的随动区块 objWindow.scroll(function() {
if (objWindow.scrollTop() > offset.top){
if(rollBox.html(null)){
rollSet.clone().prependTo('.da_rollbox');
}
rollOut.fadeOut();
rollBox.show().stop().animate({marginTop: objWindow.scrollTop() - offset.top + 20},400);
} else {
rollOut.fadeIn();
rollBox.hide().stop().animate({marginTop:0},400);
}
});

  码中已有完整注释,只需要写上几个class或者id(最好不要是id,w3c规定id不能重复使用)。

jQuery 随滚动条滚动效果 (适用于内容页长文章)的更多相关文章

  1. jQuery 随滚动条滚动效果 (固定版)

    //侧栏随动 var rollStart = $('.feed-mail'), //滚动到此区块的时候开始随动 rollSet = $('.search,.weibo,.group,.feed-mai ...

  2. jquery控制div随滚动条滚动效果

    <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jquery div随滚动条 ...

  3. javascript实现 滚动条滚动 加载内容

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. jquery 禁止滚动条滚动,并且滚动条不消失,页面大小不闪动

    一,禁止滚动,滚动条不消失,页面大小不闪动 //禁止滚动条滚动 function unScroll() { var top = $(document).scrollTop(); $(document) ...

  5. jQuery仿百度帖吧头部固定不随滚动条滚动效果

    <style> *{margin:0px;padding:0px;} div.nav{background:#000000;height:57px;line-height:57px;col ...

  6. jquery操作滚动条滚动到指定元素位置 scrollTop

    $('.brand_t a').bind('click',function(){ if($(this).attr('title1')){ var toChar = $(this).attr('titl ...

  7. Jquery 文字上下滚动效果示例代码

      <!doctype html>   <html>   <head>   <meta charset="utf-8">       ...

  8. JQuery控制滚动条滚动到指定位置

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. jquery操作滚动条滚动到指定位置

    <html><head><script type="text/javascript" src="/jquery/jquery.js" ...

随机推荐

  1. MVC不错的学习资料

    MVC不错的学习资料: http://www.cnblogs.com/darrenji/

  2. 使用FMDB,libqrencode实现二维码的生成并且保存到数据库

    /**  * 1.首先导入第三方库FMDB和libqrencode,添加库libsqlite3.tbd     

  3. iOS框架介绍

    iOS框架介绍      Cocoa Touch   GameKit  实现对游戏中心的支持,让用户能够在线共享他们的游戏相关的信息  iOS设备之间蓝牙数据传输   从iOS7开始过期   局域网游 ...

  4. DataSet 图解

    DataSet层次结构中的类请参见表所示: 类 说明 DataTableCollection 包含特定数据集的所有DataTable对象 DataTable 表示数据集中的一个表 DataColumn ...

  5. python核心编程-习题-第二章

    PS:PDF在线地址:http://bcmi.sjtu.edu.cn/~zhaohai/ptm2012/data/Python-kernel.programming.v2.pdf 2-1  变量,pr ...

  6. 【Python备忘】python判断文件和文件夹是否存在

    python判断文件和文件夹是否存在 import os os.path.isfile('test.txt') #如果不存在就返回False os.path.exists(directory) #如果 ...

  7. 打造阅读Linux源代码利器

    打造阅读Linux源代码利器 在Linux里阅读/编写代码一般用vi 但是碰到较大的项目时阅读源代码还是比较费力,一直用find  和 grep命令. 其实,我们自己可以打造一个阅读源代码的vim,这 ...

  8. python bool值要注意的一些地方

    1.像(),[],{}这三个是可以通过bool(()),bool([]),bool({})转化为bool值的:且它们转化后的结果为False.但是这三个值它本身并不等于False.切记不可以与Fals ...

  9. ASP.NET 短路由配置

    1. 首先在项目新建文件叫App_Code或者App_Start 在文件中新建WebFromRouteHandler.cs 文件. WebFromRouteHandler中的代码如下, public  ...

  10. SQL 临时表或表变量替代游标

    1.如果表没有自动增长的标识列(int) 使用临时表 SELECT IDENTITY(int) NewID ,.. INTO #tmp FROM YouTable 2.表有标识列 使用表变量 INSE ...