这是一款非常有用且效果非常酷的jQuery页面头部带loading进度指示的滚动页面特效。

该特效在页面滚动的时候页面头部有Loading进度条指示当前页面滚动的位置，这能够让用户知道当前阅读的地方距离页面底部还有多少距离。

该页面头部loading特效共同拥有4中效果：主要的loading进度条效果，整个头部作为loading进度条的效果，站点logo作为loading进度条的效果和loading和站点logo进度条同一时候操作的效果。

在线演示：http://www.htmleaf.com/Demo/201503161530.html

下载地址：http://www.htmleaf.com/jQuery/Layout-Interface/201503161529.html

页面头部带loading进度指示的jQuery滚动页面特效的更多相关文章

  1. jQuery Mobile 页面事件

    jQuery Mobile 页面事件 在 jQuery Mobile 中与页面打交道的事件被分为四类: Page Initialization - 在页面创建前,当页面创建时,以及在页面初始化之后 P ...

  2. 带网上开户表单jQuery焦点图

    带网上开户表单jQuery焦点图是一款适合证券公司的带表单的图片左右滚动切换特效代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class="ind ...

  3. jQuery模拟页面加载进度条

    因为我们无法通过任何方法获取整个页面的大小和当前加载了多少,所以想制作一个加载进度条的唯一办法就是模拟.那要怎么模拟呢? 我们知道,页面是从上往下执行的,也就是说我们可以大致估算出在页面的某个位置加载 ...

  4. 赞！带进度条的 jQuery 文件拖放上传插件

    jQuery File Uploader 是一个 jQuery 文件拖放上传插件,包括 Ajax 上传和进度条效果.作者编写这个插件的想法是要保持它非常简单,不像其他的插件,很多的标记,并提供一些 H ...

  5. JQuery实战——页面进度条效果

    今早逛阮一峰大神的博客 ECMAScript 6 入门 时候看到页面顶部有个进度条显示当前浏览的进度,如图: 顶部进度条会根据当前页面高度进行宽度调整,实战一番,视觉使用animated方法实现.下面 ...

  6. 【jQuery】页面顶部显示的进度条效果

    <!Doctype html> <html> <head> <title>页面顶部显示的进度条效果</title> <meta htt ...

  7. 【原生JS插件】LoadingBar页面顶部加载进度条

    先展示一下已经实现的效果: 预览地址:http://dtdxrk.github.io/js-plug/LoadingBar/index.html 看到手机上的浏览器内置了页面的加载进度条,想用在pc上 ...

  8. jQuery带控制按钮向上和向下滚动文本列表

    效果:http://hovertree.com/texiao/jquery/64/ 效果图如下: 代码如下: <!DOCTYPE html> <html> <head&g ...

  9. Android loading进度条使用简单总结

    在这里,总结一下loading进度条的使用简单总结一下. 一.说起进度条,必须说说条形进度条,经常都会使用到嘛,特别是下载文件进度等等,还有像腾讯QQ安装进度条一样,有个进度总给人良好的用户体验. 先 ...

随机推荐

  1. RabbitMQ消息可靠性分析 - 简书

    原文:RabbitMQ消息可靠性分析 - 简书 有很多人问过我这么一类问题:RabbitMQ如何确保消息可靠?很多时候,笔者的回答都是:说来话长的事情何来长话短说.的确,要确保消息可靠不只是单单几句就 ...

  2. GitHub上传项目，使用desktop（客户端）教程

    GitHub上传项目,使用desktop(客户端)教程  搜索“GitHub上传项目”,能得到很多相关的文章教程,里面讲的都特别麻烦,要弄什么ssh之类的,可算是吓坏了我,使我非常的怀疑为什么GitH ...

  3. Maven系列--web.xml 配置详解

    一 .web.xml介绍 启动一个WEB项目的时候,WEB容器会去读取它的配置文件web.xml,读取<listener>和<context-param>两个结点. 紧接着,容 ...

  4. if判断语句

     6)if判断语句   if ... then   else   end if;     if ... then   elsif ... then   elsif ... then   else   ...

  5. Windows 8.1硬盘安装Ubuntu 14.04双系统

    Windows 8.1硬盘安装Ubuntu 14.04双系统 学习了: http://www.jb51.net/os/windows/298507.html http://www.linuxidc.c ...

  6. 零基础学HTML 5实战开发(第一季)

    開始学习html5了.趋势不得不学习啊,之前老毛说过落后就要挨打,如今是不学习就要被市场淘汰,被社会淘汰.喜欢挑战,喜欢冒险.来吧.csdn给我们提供了那么好的平台.用起来..零基础学HTML 5的实 ...

  7. Node.js 博客实例（一）简单博客

    原教程 https://github.com/nswbmw/N-blog/wiki/_pages的第一章.因为版本号等的原因,在原教程基础上稍加修改就可以实现. 环境: win7旗舰版64位 Node ...

  8. lua简单类的实现

    原文地址:http://blog.csdn.net/qqmcy/article/details/37725177 类实现: MyClass = class("MyClass") - ...

  9. sql两个字段相加减，第三个字段没有值的原因.

    错误的写法:(in_story_num-out_story_num) as story_num 正确的写法:(nvl(in_story_num,0)-nvl(out_story_num,0)) as ...

  10. html页面的简单对话框（alert, confirm, prompt）

    html页面简单的三种对话框例如以下: 1.alert(),最简单的提示框: alert("你好!"); 2.confirm(),有确认和取消两个button: if(confir ...