js和jquery获取文档对象以及滚动条位置
<div style="width:120px;height:120px;border:1px solid red; position:absolute; left:800px; top:100px; z-index:1001;" id="AdminUserStateDiv">
</div>
<div class="div1">层1</div>
<div class="div2">层2</div>
<style type="text/css">
.div1{
width:2000px;
height:2000px;
}
.div2{
background-color:#33FF66;
width:100px;
height:100px;
position:fixed;
left:50px;
top:50px;
}
</style>
<script type="text/javascript">
var UpdateSaleEnable = function (sel) {
var optVal = $(sel).val();
var id = $(sel).attr("id").split('_')[1];
// alert(optVal + "--------" + id);
// $.ajax({
// type: 'post',
// url: "/System/DetailSaleInfoState", //Controller和action地址
// data: 'id=' + id + '&enableid=' + optVal, //参数
// success: function (data) {
// alert(data.message); //confirm
// },
// error: function (err) { alert(Promotions.messages.yichangcuowu); }
// });
$.ajax({
url: "/System/DetailSaleInfoState",
async: true,
data: { id: id, enableid: optVal },
type: "Post",
dataType: "json",
beforeSend: function () {
},
success: function (dataT) {
alert(dataT.message);
},
error: function (er) {
alert(er);
}
});
}
var showAdminUser = function (obj) {
var offSet = $(obj).offset();
var docTop = offSet.top; //当前元素相对文档top偏移位置
var docLeft = offSet.left; //当前元素相对文档left偏移位置
var docWidth = $(document).width(); //整个页面文档的宽度
var docHeight = $(document).height(); //整个页面文档的高度
var dScrollTop = $(document).scrollTop(); //整个文档滚动条相对top位置
var wScrollTop = $(window).scrollTop(); //整个屏幕滚动条相对top位置
var winWidth = $(window).width(); //整个屏幕宽度
var winHeight = $(window).height();//整个屏幕高度
alert("docWidth: " + docWidth + "——" + "docHeight:" + docHeight + " dScrollTop:" + dScrollTop);
var dWidth = document.body.offsetWidth; //纯javascript整个页面文档的宽度
var hHeight = document.body.offsetHeight; //纯javascript整个页面文档的高度
var scrollTop = document.body.scrollTop + document.documentElement.scrollTop
alert(" docWidth: " + dWidth + " docHeight: " + hHeight + " : " + scrollTop);
}
$(document).ready(function () {
$(window).scroll(function () {
var scrollTop = $(document).scrollTop();
//alert(scrollTop);
var AdminUserStateDiv = $("#AdminUserStateDiv");
//AdminUserStateDiv.css("top", scrollTop + "px");
AdminUserStateDiv.animate({ "top": scrollTop + "px" }, 0);
//$("#scrollUl").animate({ "marginLeft": scrollposition + "px" }, 10);
})
});
</script>
<style type="text/css">
#back-to-top{height:24px}
p#back-to-top a span{margin-bottom:2px;}
p#back-to-top a span {border-radius:0;}
</style>
<div class="suggest" style="position:fixed; height:104px; bottom:100px; float:left; display:none; ">
<div class="suggestLeft" style="float:left;">
<p flag='0' id='myClose' style="display:block;left: 1126.5px; ">
<a href="javascript:showAdvice();">
<span style=" background:url('http://88db.cn/cn/html/advice/images/right-bg.jpg') no-repeat scroll 0px 0px; display:block; height:60px;line-height: 14px;overflow: hidden;width:23px;float:left;padding:20px 0 0 2px;color: #FF6600;text-align: center;text-decoration: none">意见反馈</span>
</a>
</p>
<p id="back-to-top" >
<a href="#top">
<span style="background:url('http://88db.cn/cn/html/advice/images/right-bg.jpg') no-repeat scroll -25px -80px; display:block; height: 24px;overflow: hidden;padding-top:0;width:25px">
</span>
</a>
</p>
</div>
</div>
<script type="text/javascript">
//当滚动条的位置处于距顶部100像素以下时,跳转链接出现,否则消失
var width = $(document).width();
//alert("widt:"+width);
var offleft = width - 26;
if ($.browser.msie && ($.browser.version == "6.0")) {
//alert("ie6");
$("#back-to-top").css("position", "absolute");
$("#myClose").css("position", "absolute");
}
if ($.browser.msie) {
offleft = width - 47;
}
$(document).ready(function () {
//var offleft = width-47; //(width-990)/2+990;
$(".suggest").css("left", offleft + "px");
setTimeout($(".suggest").css("display", "block"), 10);
$("#back-to-top").css("left", offleft + "px");
$("#myClose").css("left", offleft + "px");
/****/
//alert("left4");
// $(window).scroll(function () {
// //alert("java");/****/
// if ($(window).scrollTop() > 100) {
// //width = $(document).width();
// //alert("widt:"+width);
// //offleft = width-40; //(width-990)/2+990; //25是反馈意见框的宽度
// //$(".suggest").css("left",offleft+"px");
// $("#back-to-top").fadeIn(500);
// //$(".suggest").fadeIn(500);
// } else {
// $("#back-to-top").fadeOut(500);
// //$(".suggest").fadeOut(500);
// }
// if ($.browser.msie && ($.browser.version == "6.0")) {
// var y = $(window).scrollTop() + 400;
// var backToY = y + 80;
// $("#back-to-top").css("top", backToY + "px");
// $("#myClose").css("top", y + "px");
// }
// });
//当点击跳转链接后,回到页面顶部位置
$("#back-to-top").click(function () {
$('body,html').animate({ scrollTop: 0 }, 100);
return false;
});
});
/****/
</script>
<!--回到顶部结束-->
js和jquery获取文档对象以及滚动条位置的更多相关文章
- js、jQuery 获取文档、窗口、元素的各种值
基于两年开发经验,总结了 javascript.jQuery 获取窗口.文档.元素的各种值 javascript: 文档:是整个document所有的内容 浏览器当前窗口文档body的宽度: docu ...
- jquery获取文档高度和窗口高度的例子
jquery获取文档高度和窗口高度,$(document).height().$(window).height() $(document).height():整个网页的文档高度 $(window).h ...
- jquery获取文档高度和窗口高度汇总
jquery获取窗口高度和窗口高度,$(document).height().$(window).height() $(document).height():整个网页的文档高度 $(window).h ...
- js和jQuery获取各种屏幕或文档的高度和宽度
1.jQuery获取文档或屏幕的高度 console.log($(window).height());//浏览器页面当前屏幕可见区域的高度 console.log($(document).height ...
- 数组对象元素的添加,String对象,BOM对象以及文档对象的获取
数组对象的删除有三种方法: pop(); //移除最后一个元素并返回该元素值shift(); //移除最前一个元素并返回该元素值,数组中元素自动前移splice(0,2); / ...
- JS第二部分--DOM文档对象模型
一.DOM的概念 二.DOM可以做什么 三.DOM对象的获取 四.事件的介绍 五.DOM节点标签样式属性的操作 六.DOM节点对象对值的操作 七.DOM节点-标签属性的操作(例如id class sr ...
- js 和 jquery 获取页面和滚动条的高度 视口高度文档高度
js 和 jquery 获取页面和滚动条的高度 //页面位置及窗口大小 function GetPageSize() { var scrW, scrH; if(window.innerHeight & ...
- jquery.cookie 使用文档,$.cookie() 文档教程, js 操作 cookie 教程文档。
jquery.cookie 使用文档,$.cookie() 文档教程, js 操作 cookie 教程文档. jquery.cookie中的操作: jquery.cookie.js是一个基于jquer ...
- 使用jQuery匹配文档中所有的li元素,返回一个jQuery对象,然后通过数组下标的方式读取jQuery集合中第1个DOM元素,此时返回的是DOM对象,然后调用DOM属性innerHTML,读取该元素 包含的文本信息
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- FIR滤波器(1)- 基础知识
FIR滤波器广泛应用于数字信号处理中,主要功能就是将不感兴趣的信号滤除,留下有用信号.FIR滤波器是全零点结构,系统永远稳定:并且具有线性相位的特征,在有效频率范围内所有信号相位上不失真.在无线通信收 ...
- DWZ前端框架使用问题记录
心得体验:DWZ依赖特定的HTML结构,所以一定要注意项目中的HTML结构,多用firebug查看,还有如果使用一些组件的时候出现问题,可以查看下返回JSON格式是否符合组件规定的JSON格式,很多都 ...
- 如何设置SecureCRT通过代理连接SSH[转]
http://blog.didu.me/article/84 公司限制了连接外网的端口和IP,只能通过proxy 连接.刚配置了一下 secureCRT 连接外网,貌似速度还是不错,写出来共享下. 如 ...
- Lucene 4.0
关于4.0的Update Index ,Create Index /* * Create Index */ public static void createIndex() throws IOExc ...
- 例题6-8 Tree Uva548
这道题我一直尝试用scanf来进行输入,不过一直没有成功,因此先搁置一下,以后积累些知识再进行尝试. 这道题有两种解决方案: 即先建树,再遍历和边建树边遍历.这两种方案经过实践证实效率相差不太多.应该 ...
- Java注意的地方
oo: 单一原则(SRP) 开放封闭原则(OCP) 里氏替换原则(LSP) 依赖倒转原则(DIP) 接口分离原则(ISP) equals: 若两个对象equals为true,则他们的hashcode值 ...
- TLV格式是什么格式
TLV 格式是什么格式 一种可变格式, TLV 的意思就是: Type 类型, Lenght 长度, Value 值: Type 和 Length 的长度固定,一般那是 2 . 4 个字节: Valu ...
- linux学习之进程,线程和程序
程序.进程和线程的概念 1:程序和进 ...
- openerp模块收藏 auto_setup 自动帮你完成建新库时必做几个操作(转载)
auto_setup 自动帮你完成建新库时必做几个操作 原文:http://shine-it.net/index.php/topic,6777.0.html 模块地址: https://github. ...
- IAR修改工程名称Tab键设置模板建立
IAR 修改工程名称 很多时候用IAR开发都是基于已有工程模板开发的,但是工程模板的名称经常让人头疼:以下是修改办法: 从一个实例工程复制后缀名为"dep,ewd,ewp,eww" ...