<!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>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>jQuery Scroller</title>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

</head>

<body>

<div id="myDiv" style="width: 500px; height: 100px; overflow: auto; border: 1px solid black;"></div>

<input type="text" id="myTextInput" />

<input type="button" value="Send" id="postButton" />

<div id="info"/>

<script type="text/javascript">

 $(document).ready(function(){

  $('#postButton').click(function(){

   $('#myDiv').append($('#myTextInput').val() + '<br/>');

   $('#myTextInput').val('');

   $("#myDiv").animate({ scrollTop: $("#myDiv")[0].scrollHeight - $('#myDiv').height() }, 3000);

  });

 });

</script>

</body>

</html>

jquery 让滚动条处于div底部的更多相关文章

  1. jQuery——检测滚动条是否到达底部

    一.jQuery检测浏览器window滚动条到达底部 jQuery获取位置和尺寸相关函数:$(document).height()    获取整个页面的高度:$(window).height()    ...

  2. jquery判断滚动条是否到底部

    clientHeight:这个元素的高度,占用整个空间的高度,所以,如果一个div有滚动条,那个这个高度则是不包括滚动条没显示出来的下面部分的内容.而只是单纯的DIV的高度. offsetHeight ...

  3. jQuery判断滚动条滚到页面底部脚本

    原文地址 http://www.111cn.net/wy/jquery/61741.htm

  4. JQuery 判断滚动条是否到底部

    BottomJumpPage: function () { var scrollTop = $(this).scrollTop(); var scrollHeight = $(document).he ...

  5. jQuery检测滚动条(scroll)是否到达底部

    一.jQuery检测浏览器window滚动条到达底部 jQuery获取位置和尺寸相关函数: $(document).height()    获取整个页面的高度 $(window).height()   ...

  6. jQuery 滚动条 滚动到底部（下拉到底部） 加载数据(触发事件、处理逻辑)、分页加载数据

    1.针对浏览器整个窗口滚动 主要代码: <script type="text/javascript"> ; function GetProductListPageFun ...

  7. jQuery判断滚动条是上滚还是下滚，且是否到达底部或顶部

    jQuery判断滚动条是上滚还是下滚,且是否到达底部或顶部:http://www.haorooms.com/post/jquery_scroll_upanddown //滚动条滚动加载更多内容 //判 ...

  8. 一款回到顶部的 jQuery 插件，支持 Div 中的滚动条回到顶部

    前言 今天在网上搜索“回到顶部”的 jQuery 插件,网上有很多,但是大部分都不支持让 Div 中的滚动条回到顶部.于是乎,不放弃,自己参考 Github 上的一个 jQuery 插件,经过自己的修 ...

  9. Jquery 判断滚动条到达顶部或底部

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

随机推荐

  1. ios 大图 真机不显示的问题

    png的图片只是命名为png,格式不是png的. 打开terminal终端,cd图片目录,输入命令sips -s format png *.* --out pngs,再把图片覆盖即可

  2. 用Java编程找到两个字符串中共有的字符

    这道题的算法思想是把字符串1中的每个字符与字符串2中的每个字符进行比较,遇到共同拥有的字符,放入另一个数组中,最后顺序输出即可 但是这道题的难点在于怎么排除重复的字符 public class bot ...

  3. 2014 项目中用到batik

    现在手头上的项目用到batik编程,用的maven管理jar包,要在pom.xml中dependencies标签下添加一下配置(batik编程使用的顶层jar包) <dependency> ...

  4. 什么是 kNN 算法？

    学习 machine learning 的最低要求是什么?  我发觉要求可以很低,甚至初中程度已经可以.  首先要学习一点 Python 编程,譬如这两本小孩子用的书:[1][2]便可.   数学方面 ...

  5. tab使用 TabActivity TabHost Tabspec常用方法

    本文是参考Android官方提供的sample里面的ApiDemos的学习总结.   TabActivity   首先Android里面有个名为TabActivity来给我们方便使用.其中有以下可以关 ...

  6. Android中通过注解代替findViewById方法

    转自:http://www.2cto.com/kf/201405/302998.html 这篇文章主要讲解注解实现findViewById的功能,首先我们来熟悉一下在java中怎么定义一个注解和解析一 ...

  7. Voreen (二) 入点出点计算

    继第一篇Voreen的文章介绍主流程以后,第二篇介绍Raycast的第一个绘制Pass,根据代理几何体绘制出入点出点.如上次所说,OptimizedProxyGeometry负责生成表示体数据的代理几 ...

  8. 【转】Qt下使用glut库

    ps:这个说的很明白,尤其是win10环境下用mingw环境时编程时碰到的问题, 1.加 windows.h 2.在.pro 添加libs     博文地址:Qt下使用glut库   本人使用的环境 ...

  9. SQL --Chapter 04 数据更新

    数据的插入(INSERT语句的使用方法) INSERT INTO ShohinIns (shohin_id, shohin_mei, shohin_bunrui, hanbai_tanka, 原则上, ...

  10. 16 On Large-Batch Training for Deep Learning: Generalization Gap and Sharp Minima 1609.04836v1

    Nitish Shirish Keskar, Dheevatsa Mudigere, Jorge Nocedal, Mikhail Smelyanskiy, Ping Tak Peter Tang N ...