<!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 视频录制、压缩、上传

    项目中实现功能 视频的录制.压缩.上传 首先调用系统的相机或相册 iOS录制的视频是mov格式的,安卓和PC不支持,因此要转换成MP4,并且要压缩. 获取到视频或者照片,处理的方法 下面两个方法是获取 ...

  2. OD18

    介绍一个工具exescope   可以修改一些exe程序里的东西 通过这个工具   我们找到了我们要除掉的NAG窗口的具体位置            那我们可以通过OD进行跟踪     来到程序头下段 ...

  3. Grunt入门教程

    引入:grunt是一套前端自动化工具,一个基于nodeJs的命令行工具,一般用于: ① 压缩文件 ② 合并文件 ③ 简单语法检查 环境:grunt是基于nodejs运行的,所以需要有nodejs,在N ...

  4. Photoshop的评价

    Photoshop是Adobe公司旗下最为出名的图像处理软件之一. Photoshop的功能性:主要处理以像素所构成的数字图象.使用其众多的编修与绘图工具,可以有效地进行图片编辑工作.支持Window ...

  5. 获取select标签的值

    1.设置value为pxx的项选中 $(".selector").val("pxx"); 2.设置text为pxx的项选中 $(".selector& ...

  6. c#读取XML

    http://www.cnblogs.com/a1656344531/archive/2012/11/28/2792863.html ================================= ...

  7. 网站统计中的数据收集原理及实现（share）

    转载自:http://blog.codinglabs.org/articles/how-web-analytics-data-collection-system-work.html 网站数据统计分析工 ...

  8. krpano 小记

    给网易漫画部做了一个全景的纸盒视频,在这里记录一些功能实现点. 背景音乐的播放: 1.插件引用 <plugin name="soundinterface"         u ...

  9. Arduino101/Genuino101的安装入门

    1.首先下载Arduino IDE                      下载地址:http://pan.baidu.com/s/1gewqV2j 选择arduino-1.6.8-windows. ...

  10. 如何把一个用户加入sodu组

    在一个命令前加sudo,可以使用超级用户的权限执行该命令.但并不是任何用户都可以使用sudo,只有用户属于sudo组时才能使用这个命令. 如 果希望把一个用户加入sudo组,可以用root登录系统,然 ...