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/ ...
随机推荐
- 会场安排问题—NYOJ14
时间限制:3000 ms | 内存限制:65535 KB 难度:4 描述 学校的小礼堂每天都会有许多活动,有时间这些活动的计划时间会发生冲突,需要选择出一些活动进行举办.小刘的工作就是安排学校 ...
- 躲避球游戏ios源码
躲避球游戏源码,有限源码是一个基于cocos2d的躲避球游戏源码的,并且还引用了大家熟悉google广告的,进行推广,已经还有带game center等,游戏操作很简单,用手指按住物体,然后移动物体避 ...
- Android开发之计算器(一)界面设计
计算器开发主要涉及到LinearLayout布局.EditText.Button的使用.为android入门基础内容. 打开android studio选择创建一个新的工程,应用程序的名称为Calcu ...
- Vue.js 2.0版
Vue.js 2.0版升级,更改了好多方法或指令 new Vue({ el:'#demo', data:{ msg:"vue2.0" } }) v-model lazy numbe ...
- jQuery select的操作代码
jQuery對select的操作的实际应用代码. //改變時的事件 复制代码代码如下: $("#testSelect").change(function(){ //事件發生 j ...
- getchar(),gets(),scanf()的差异比较
scanf( )函数和gets( )函数都可用于输入字符串,但在功能上有区别.若想从键盘上输入字符串"hi hello",则应该使用gets()函数. gets可以接收空格:而sc ...
- 括弧匹配检验(check)
/*题目:括弧匹配检验 检验给定表达式中括弧是否正确匹配 (两种括弧“( ) ”“[]" ,正确输出OK,错误则输出wrong. 2016年8月8日07:24:58 作者:冰樱梦 */ # ...
- VS2010调试入门指南
1 导言 在软件开发周期中,测试和修正缺陷(defect,defect与bug的区别:Bug是缺陷的一种表现形式,而一个缺陷是可以引起多种Bug的)的时间远多于写代码的时间.通常,debug是指发现缺 ...
- 一些 PHP 管理系统程序中的后门
一些php网站管理程序的,一些后门,其实官方也没有恶意,主要是大家为了自己的安全. 我倒不怎么关心提示框,SABLOG怎么知道我的版本有漏洞呢,程序肯定有后门.每次登陆后台自动检测官方版本跟当前版本对 ...
- C++实现数字媒体三维图像渲染
C++实现数字媒体三维图像渲染 必备环境 glut.h 头文件 glut32.lib 对象文件库 glut32.dll 动态连接库 程序说明 C++实现了用glut画物体对象的功能.并附带放大缩小,旋 ...