原文地址:http://www.jqueryba.com/3403.html

<script src="jquery.min.js" type="text/javascript">
</script>
<script type="text/javascript">
$(function() {
$("#updown").css("top", window.screen.availHeight / 2 - 100 + "px");
$(window).scroll(function() {
if ($(window).scrollTop() >= 100) {
$('#updown').fadeIn(300);
} else {
$('#updown').fadeOut(300);
}
});
$('#updown .up').click(function() {
$('html,body').animate({
scrollTop: '0px'
},
800);
});
$('#updown .down').click(function() {
$('html,body').animate({
scrollTop: document.body.clientHeight + 'px'
},
800);
});
});
</script>

jQuery实现置顶和置底特效的更多相关文章

  1. js上移、下移、置顶、置底功能实现

    实现页面上列表内容上移.下移.置顶.置底 功能,主要实现思路是节点操作,比如说:上移,直接把点击项移动到前一个节点,以此类推,当然实际代码实现还要加些判断,如当前点击操作项是否已经是置底或置底了,如果 ...

  2. FMX 窗口置顶 或置底 xe10

    FMX 窗口置顶  或置底 xe10 Popup 置底 StayOnTop 置顶

  3. 微信小程序 置顶/取消置顶

    wxml <view wx:for="{{confirmlist}}" wx:for-item="confirm" wx:for-index=" ...

  4. 置顶,置低实现与window.scroll

    //置顶,置低实现 $('#updown .up').click(function(){$('html,body').animate({scrollTop: '0px'}, 300);}); $('# ...

  5. jquery中的置顶,置底,向上,向下的排序功能

    css .selectedLi{background: #f0ad4e;color:#fff;} html部分 <ul class="seetSelect2" id='sys ...

  6. iOS UILabel 文字 置顶/置底 实现

    iOS UILabel控件默认文字位置是居中的,如图所示: 但是我们经常碰到这样的需求,希望文字向上置顶,或者向下置底,但是很遗憾,iOS API中并没有提供相应的属性和方法,需要我们手动设置. 利用 ...

  7. Ionic-wechat项目边开发边学(四):可伸缩输入框,下拉刷新, 置顶删除

    摘要 上一篇文章主要介绍了ion-list的使用, ion-popup的使用, 通过sass自定义样式, localStorage的使用, 自定义指令和服务. 这篇文章实现的功能有消息的置顶与删除, ...

  8. jQuery 元素的选中, 置顶、上移、下移、置底、删除

    如截图: <ul> <li class="li01" onclick="C_columnSetTop(this)"><i>& ...

  9. [知了堂学习笔记]_css3特效第二篇--行走的线条&&置顶导航栏

    一.行走的线条. 效果图(加载可能会慢一点儿,请稍等...): html代码: <div class="movingLines"> <img src=" ...

随机推荐

  1. Scala-变量、常量和懒加载

    package com.mengyao.scala.function /** * Scala的变量声明和使用(可变类型和值类型) *  * @author mengyao */object Test0 ...

  2. WINDOWS OPTIMIZE

    WIN10 SHUT DOWN AUTOMATICALLY UPDATE 1.service -> windows update 2.gpedit ->计算机配置 - 管理模板 - Win ...

  3. RIP协议两个版本号对不连续子网的支持情况实验

    (增加时注明"会员咨询")

  4. JSTL配合正则表达式在JSP中的应用

    <%@ page language="java" import="java.util.*,cn.com.Person" pageEncoding=&quo ...

  5. C#调用R语言输出图片

    参考:http://rdotnet.codeplex.com/documentation   REngine.SetEnvironmentVariables(); REngine engine = R ...

  6. 输入内容, 列出可选的项: QComboBox

    #include "widget.h" #include "ui_widget.h" #include <QtGui/QCompleter> #in ...

  7. Qt 域名转成IP

    #include <stdio.h>#include <stdlib.h>#include <netdb.h>#include <arpa/inet.h> ...

  8. Spinner( 微调) 组件

    本节课重点了解 EasyUI 中 Spinner(微调)组件的使用方法,这个组件依赖于ValidateBox(验证框)组件. 一. 加载方式Spinner(微调)组件是其他两款高级微调组件的基础组件, ...

  9. ViewPager欢迎页

    布局  <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:to ...

  10. 你好,C++(1)C++是什么?C++的“前世今生”

    The world is built on C++. ——Herb Sutter the chairman of the ISO C++ standards committee and chief n ...