浮动QQ绝对定位

ws_hgo 2009-11-03 03:46:08

效果不论是在什么屏幕(17,19,21,24)那个滚动就在
页面新闻资讯的旁边也就是像第一附图这个样子
第一幅图

下面是第2附图
宽屏的效果

...全文

153 10 打赏收藏转发到动态举报

写回复

用AI写文章

10 条回复

切换为时间正序

请发表友善的回复…

发表回复

sohighthesky 2009-11-03

打赏
举报

没有完全代码，无法定位
，先给你这个方法：



var getPosition=function(o){//取元素坐标

		var x = 0, y = 0;

		do{

		    x += o.offsetLeft;

		    y += o.offsetTop;

		}while(o=o.offsetParent);

		return {'x':x,'y':y};

	}

然后，在你的代码后加上这句：
STATICMENU.style.left=getPosition("右边一个元素的对象").x-STATICMENU.clientWidth-10+"px";//-10是让跟右边隔点距离，你自己控制
另外
STATICMENU.style.top
这个地方最好用document.getElementById来获取对象，否则非ie不支持

ws_hgo 2009-11-03

打赏
举报

[Quote=引用 8 楼 sohighthesky 的回复:]
引用 7 楼 ws_hgo 的回复:
引用 5 楼 sohighthesky 的回复:
是固定位置的吧？看我最新博客

你那个太复杂
看不太懂

你看下我的代码怎么修改下

。。。
把那个js加进去，然后fixPosition(obj,"lc")或者,fixPosition(obj,{left:100,top:100});就行了

你这个有什么问题？
[/Quote]
我的那个浮动
在17皴里面可以当是在宽屏的话
就跑到左边去啦

sohighthesky 2009-11-03

打赏
举报

[Quote=引用 7 楼 ws_hgo 的回复:]
引用 5 楼 sohighthesky 的回复:
是固定位置的吧？看我最新博客

你那个太复杂
看不太懂

你看下我的代码怎么修改下
[/Quote]
。。。
把那个js加进去，然后fixPosition(obj,"lc")或者,fixPosition(obj,{left:100,top:100});就行了

你这个有什么问题？

ws_hgo 2009-11-03

打赏
举报

[Quote=引用 5 楼 sohighthesky 的回复:]
是固定位置的吧？看我最新博客
[/Quote]
你那个太复杂
看不太懂

你看下我的代码怎么修改下

ws_hgo 2009-11-03

打赏
举报

先看看

sohighthesky 2009-11-03

打赏
举报

是固定位置的吧？看我最新博客

ws_hgo 2009-11-03

打赏
举报

草根醉秋意 2009-11-03

打赏
举报

可以相对于内容的边距来计算浮动层的位置的，就是先得到内容容器距离左边的距离，然后减去浮动层与内容内容器及浮动层的宽度。

有一种情况是屏幕分表率过小的话，浮动层必须要在内容的上面……

RUN_ 2009-11-03

打赏
举报

你的页面在不同分辨率下相同的定位就好了啊。

ws_hgo 2009-11-03

打赏
举报

下面是我的代码



<%@ Control Language="C#" ClassName="flash" %>



<script runat="server">



</script>

<DIV id="STATICMENU" style="Z-INDEX:999; LEFT:0px;WIDTH: 76px;POSITION: absolute;HEIGHT: 200px;">

    <table width="65" border="0" cellspacing="0" cellpadding="0" height="257">

                <tr>

                  <td valign="top" style="width: 64px; height: 38px;" background="images/bj0.jpg"><img src="images/001.jpg" width="64" height="30" /></td>

                </tr>

                <tr>

                  <td valign="top" style="width: 64px; height: 34px;" background="images/bj0.jpg"><a href="cpzs.aspx?id=101"><img src="images/002.jpg" width="64" height="58" border="0" /></a></td>

                </tr>

                <tr>

                  <td valign="top" style="width: 64px; height: 50px" background="images/bj0.jpg"><a href="yljd.aspx"><img src="images/003.jpg" width="64" height="57" border="0" /></a></td>

                </tr>

                <tr>

                  <td valign="top" style="width: 64px; height: 48px" background="images/bj0.jpg"><a href="zljs.aspx"><img src="images/004.jpg" width="64" height="48" border="0" /></a></td>

                </tr>

                <tr>

                  <td valign="top" style="width: 64px; height: 50px;"><a href="sw.aspx"><img src="images/005.jpg" width="64" height="58" border="0" /></a></td>

                </tr>

              </table>

<SCRIPT language="javascript">

<!--

var stmnGAP1=70;

var stmnGAP2=250;

var stmnBASE=70;

var stmnActivateSpeed=200;

var stmnScrollSpeed=10;

var stmnTimer;

function RefreshStaticMenu()

{

	var stmnStartPoint,stmnEndPoint,stmnRefreshTimer;	

	stmnStartPoint=parseInt(STATICMENU.style.top,10);	

	stmnEndPoint=document.documentElement.scrollTop+stmnGAP2;	

	if(stmnEndPoint<stmnGAP1)stmnEndPoint=stmnGAP1;	

	stmnRefreshTimer=stmnActivateSpeed;	

	if(stmnStartPoint!=stmnEndPoint){

		stmnScrollAmount=Math.ceil(Math.abs(stmnEndPoint-stmnStartPoint)/15);		

		STATICMENU.style.top=parseInt(STATICMENU.style.top,10)+((stmnEndPoint<stmnStartPoint)?-stmnScrollAmount:

		stmnScrollAmount);		

		stmnRefreshTimer=stmnScrollSpeed;		

	}

	stmnTimer=setTimeout("RefreshStaticMenu();",stmnRefreshTimer);	

}

STATICMENU.style.top=document.documentElement.scrollTop+stmnBASE;

RefreshStaticMenu();

//-->

</SCRIPT>



</DIV>