<!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. WebStrom 10 注册码（转）

    webStorm : UserName:William ===== LICENSE BEGIN ===== 45550-12042010 00001SzFN0n1bPII7FnAxnt0DDOPJA ...

  2. CxImage在VS2010下的配置

    http://blog.csdn.net/youzhuo/article/details/24601621 一.编译Cximage 1.在SourceForge上下载cximage702_full.7 ...

  3. 直接请求json文件爬取天眼查企业信息（未解决验证码问题）——python3实现

    几个月前...省略一堆剧情...直接请求json文件爬取企业信息未成功,在知乎提问后,得到解决,有大佬说带上全部headers和cookie是可以的,我就又去试了下,果然可以(之前自己试的时候不行,没 ...

  4. 实时控制软件设计 第二次作业 myRobot

    #include<iostream> #include <Eigen/Dense> #include <math.h> #include <vector> ...

  5. DELL vostro V5460 装mSATA 半高SSD硬盘后装win8.1系统

    1.介绍 DELL vostro V5460的超极本性能虽然不是那么好,但的确是我觉得样子最好看的一款.满足了,轻,薄.如果是红色的,则很适合女生用. 2.缺点 这款笔记本最大的缺点,就是有的无线网卡 ...

  6. 作业八：团队项目——Alpha阶段项目总结

    1．项目的预期目标 最初的项目计划实现一款类似微信飞机大战这样的一款模拟飞行游戏,中途也没有变动. 2．目前项目实现的功能. 击落飞机并计分. 3．下阶段我们可以增加游戏更多的功能,以及增加网络在线对 ...

  7. Python学习感悟

    学习任何新知识,我自己偏向于在实践中学习,这样效率更高:如果只是学习基本概念,会很枯燥. 现在的问题是:不是所有的新知识都可以在实践中学习!

  8. MSSQL如何在没有主键的表中删除重复数据

    为了对重复数据进行实验,下面建一个设计不太好(没有主键)表并插入了一些重复数据: create database testdb use testdb ; go create table DupsNoP ...

  9. C++ 中堆栈学习

  10. RealProxy实现AOP编程(1)

    Program.cs class Program { static void Main(string[] args) { User user = " }; var processor = T ...