最近在把演示站升级一下，百度的分享代码已经失效了，所以我就自己做了一个。中间也经历了一些困难，现在都已经解决。关于元素定位的一些心得我就记录一下。

之前太片面了，更正一下。这个需要分情况来使用。

绝对定位（不会因为 浏览器窗口打开大小 而改变）：

//竖滚动条当前的TOP值
gt = $(window).scrollTop();

//横滚动条当前的LEFT值
gw = $(window).scrollLeft();


//元素的TOP值和LEFT值
m = $("#s54818").offset();

//m元素的TOP值
m.top;

//m元素的LEFT值
m.left;

//元素本身的宽度
w = $("#s54818").outerWidth();

//元素本身的高度
h = $("#s54818").outerHeight();

//整个网页BODY的宽度
bw = $('body').width();

//整个网页BODY的高度
bh = $('body').height();


//-------------------元素在当前看到的页面上下左右的距离---------
//元素 与 当前显示的顶部距离 = 元素的TOP值 - 当前竖向滚动条的TOP值
xt = m.top-gt;

//元素 与 当前显示的左边距离 = 元素的LEFT值 - 当前横向滚动条的LEFT值
xl = m.left-gw;

//元素 与 当前显示的底部距离 = 当前显示的可见高度 - 元素到当前可见顶部的距离 - 元素本身的高度
xb = wh-xt-h;

//元素 与 当前显示的右边距离 = 当前显示的可见宽度 - 元素到当前可见左边的距离 - 元素本身的宽度
xr = ww-xl-w,

//-------------------在元素上下左右显示--------
//当 元素到浏览器右边的距离 大于 元素本身宽度 ？ ml=m元素的LEFT值  否则  ml=m元素的LEFT值-本身宽度
//（这个主要意思就是右边有位置就显示在右边，否则显示在左边 ）
ml = (xr)>w ? m.left : m.left-w;

//当 元素到浏览器底部的距离 大于 元素本身高度 ？ ml=（m元素的TOP值+m本身高度）  否则  ml=（m元素的TOP值-m本身高度）
//（这个主要意思就是下边有位置就显示在元素的下边，否则显示在元素的上边 ）
mt = (xb)>h ? m.top+h : m.top-h;
//-----------------------------------

相对定位的（会根据浏览器窗口的大小改变）：

//当前可见区域宽度
ww = $(window).width();

//当前可见区域高度
wh = $(window).height();

//竖滚动条的最大TOP值 = 整个网页BODY的高度 - 当前可见区域的高度
gt = bh - wh

知道了竖滚动条最大值 我们就可以根据情况来做出判断，比如在竖滚动条离底部还有100的距离时，显示 回到顶部 按钮
用当前竖滚动条TOP值 与 （竖滚动条最大TOP值-100） 作对比  是大于就显示


//----------------在可见区域 中间显示--------
// (可见高度-元素本身高度)/2 + 当前竖滚动条的TOP值
zt = (wh-h)/2+gt

// (可见宽度-元素本身宽度)/2 + 当前横滚动条的LEFT值
zl = (ww-w)/2+gl

zt = zt < 0 ? 0 : zt;
zl = zl < 0 ? 0 : zl;
//-----------------------------------

定位的一些应用：

//通过 appendTo 将 DIV 添加到 body元素内部的尾端
$('<div id="s54818" class="s54818"> </div>').appendTo("body");

//设置元素的TOP和LEFT位置
$("#s54818").css({left: ml,top:mt})

//动态对元素添加class类名
$("#s54818").addClass("show")