DivCSS实例：让页脚保持在未满屏页面的底部-IT技术精粹[JiShuBu.Com]-倾力打造一流IT技术平台！

IT技术精粹[JiShuBu.Com]-倾力打造一流IT技术平台！

DivCSS实例：让页脚保持在未满屏页面的底部

您现在正在浏览：首页 > CSS >

DivCSS实例：让页脚保持在未满屏页面的底部

作者：　发布时间：2008-04-06 00:16:00　来源：

　　在内容不超过一屏的情况下，当浏览器窗口变小那行页脚文字会跟着向上浮动但还是保持在底部。
　　当内容多出一屏时，他显示在网页的最下边，而不是窗口的最下边；测试了一下，还可以，在IE6、IE7、FF等都没有问题！窗口缩小时也没有问题！

　　首先是JS脚本：

div css xhtml xml Example Source Code

Example Source Code [www.52css.com]

function test(){
var infoHeight = document.getElementById("info").scrollHeight;
var bottomHeight = document.getElementById("bottom").scrollHeight;
var allHeight = document.documentElement.clientHeight;

var bottom = document.getElementById("bottom");
if((infoHeight + bottomHeight) < allHeight){
  bottom.style.position = "absolute";
  bottom.style.bottom = "0";
}else{
  bottom.style.position = "";
  bottom.style.bottom = "";
}

setTimeout(function(){test();},10);
}
test();

【评论】【加入收藏夹】【大中小】【打印】【关闭】

※ 相关信息

·CSS 文字樣式技巧 (摘自一台湾网站，确实很强！) (2008-03-08 23:17:46)

·纯css实现无图圆角矩形块！ (2008-02-20 12:46:50)

·CSS 3 选择器解释 (2008-01-19 18:06:18)

·CSS超级技巧大放送 (2008-01-13 21:47:39)

·CSS Hack 汇总[千百度资料] (2008-01-13 21:37:59)

·多个CSS样式表争夺特定选择符的控制权 (2008-01-08 17:52:28)

·CSS hack浏览器兼容一览表 (2008-01-08 15:42:52)

·web标准化、XHTML与CSS层叠样式表的关系 (2008-01-05 07:28:27)

·HTML元素的默认CSS设置介绍 (2008-01-05 07:26:33)

·CSS兼容IE6,IE7,FIREFOX (2007-12-04 18:30:25)

发表评论

用户名:	密码:
验证码:	匿名发表

文章搜索

[添加文章] [管理文章]

最新技术文档

·十天学会PHP之基础知识

·十天学会PHP之流程控制

·十天学会PHP之构建数据库

·十天学会PHP之连接数据库

·echo和print 的区别

·PHP生成随机字符串

·PHP取得文件后缀

·正则表达式经验谈

·PHP的Cookie技术介绍

·PHP数组排序

技术文档排行榜

·天气预报小偷，根据IP自动判断地址

·超经典计算机使用问题105答

·'AjaxPro'未定义错误的原因&javascript顺

·[初学者必读]网页制作之HTML基础知识

·DIV&CSS打造自动伸展三栏复合布局

·CSS网页布局入门教程：下拉及多级弹出式菜单

·阿里妈妈广告的投放技巧

·谁是网页浏览器引擎速度真正王者

·JavaScript：世界上误解最深的语言

·几种常用禁止修改输入框的方法