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/ ...
随机推荐
- 济南学习 Day1 T2 pm
[问题描述]栈是一种强大的数据结构,它的一种特殊功能是对数组进行排序.例如,借助一个栈,依次将数组 1,3,2 按顺序入栈或出栈,可对其从大到小排序:1 入栈:3 入栈:3 出栈:2 入栈:2 出栈: ...
- [DevExpress]ChartControl之时间轴示例
关键代码: using System; using System.Data; using System.Windows.Forms; using DevExpress.XtraCharts; name ...
- Discuz X3.2 SEO设置 title 不支持空格的解决方法
很多使用 Discuz X3.2 的同学都发现这么一个问题:在后台SEO设置-title设定的时候,即使你在连字符两侧输入了空格,在前台也显示不出来,很多同学纠结这个问题,今天终于找到了解决方法,在此 ...
- 一个统计目录文件大小的php函数
早上刚到公司,头告诉我,抓紧写一个小函数,用来统计指定目录中文件大小,我了个去,动手吧,还好有点小基础,一会就完工了,哈哈.代码在下面咯. <? /** 统计目录文件大小的函数 @author ...
- sublimetext2 中运行Python提示EOFError: EOF when reading a line
解决方法:一.安装sublimeREPL 打开sublimeText2按CTRL+SHIFT+P,英文版输入:install后选择Package Control: Install Package ...
- 相同的 birthday
Description Sometimes some mathematical results are hard to believe. One of the common problems is t ...
- oracle作业
http://blog.csdn.net/hao_ds/article/details/38382931 oracle作业各种参数的详细介绍
- Spark Standalone运行过程
以下内容参考http://www.cnblogs.com/luogankun/p/3912956.html 一.集群启动过程--启动Master 二.集群启动过程--启动WorkerWorker运行时 ...
- IOS 基于APNS消息推送原理与实现(JAVA后台)
Push的原理: Push 的工作机制可以简单的概括为下图 图中,Provider是指某个iPhone软件的Push服务器,这篇文章我将使用.net作为Provider. APNS 是Apple Pu ...
- Qt窗口部件及子部件
QWidget类是所有用户界面对象的基类,被称为基础窗口部件. #include <QApplication> #include<QLabel> #include<QWi ...