悬浮在页面上的窗口 - 编程论坛

#2

痞子，赵2012-11-19 08:23

有的是js,有的是ajax

#3

awl8052012-11-19 12:11

div窗口

#4

yms1232012-11-19 16:14

股票指数有些网站直接贴的图片，有些可能是用的控件来做的比如flash等

#5

跳过去2012-11-19 19:32

回复 4楼 yms123

不是股票的是旁边的那个返回顶部和意见反馈的那个会跟着页面动的

#6

跳过去2012-11-19 19:32

打开百度新闻就有的

#7

awl8052012-11-19 21:59

用一个每隔一段时间就去执行的函数去检测div的定位位置而已啊，div的位置和scroll的属性有关，你自己试一下。
时间函数好像是setTime（t,fun）;scroll的属性好像是window。scroll。Top
具体你网上搜索一下，太久没用这些函数，有些都忘光了

#8

跳过去2012-11-20 21:46

能不能弄个简单的例子来看看啊

#9

dong35802012-11-21 10:57

回复 8楼跳过去

昨天刚做的，写了一篇博文，你瞅瞅，复制一下就行了。
DIV+CSS+JS
http://

#10

冰蟾子2012-11-21 12:03

不复杂，简单的很。。给你做一个

程序代码：

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{margin:0;padding:0;}
.main{width:960px;background:#eee;border:#ccc solid 1px;height:2000px;margin:0 auto;}
#gotop{width:30px;height:80px;position:fixed;left:50%;margin-left:480px;top:85%;background:#930;cursor:pointer;display:none;}
</style>
<script type="text/javascript">
window.onload = function(){
 var gotop= document.getElementById("gotop");
 gotop.onclick=function(){
 window.scroll(0,0);
 }}
document.onscroll = function(){
 var gotop= document.getElementById("gotop");
 if(window.scrollY>200)
 {gotop.style.display = "block"; }
 else
 {gotop.style.display = "none"; }}
</script>
</head>

<body>
<div class="main">
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content
content

</div>
<div id="gotop">返回顶部</div>
</body>
</html>

[ 本帖最后由冰蟾子于 2012-11-21 12:54 编辑 ]

#11

awl8052012-11-21 12:18

我这个方法很简单，就是比较粗糙，光滑度也不是很好。
function xuanfuDiv(){
document.getElementById("xxx").style.top = Math.floor((document.documentElement.scrollTop + 200+document.getElementById("xxx").offsetTop)/2);
setTimeout("xuanfuDiv()",10);
}
我简单解释下代码，第一句就是修正div的top咯。
math.floor是向下取整，document.documentElement.scrollTop 是滚动条滚动的数值，offsetTop是div的不带px单位的top值，200是所要的位置
修正top的简单思路就是去div当前top和动态期望点的中点位置，然后一直取中点位置。逐步逼近，因为有向下取整，所以肯定会重合的。
第二句就简单了，没过10毫秒就调用一个xuanfuDiv这个函数不断修正div的top，搞定。

#12

awl8052012-11-21 12:20

当然要怎么逼近，自己可以修改，还有，怎么光滑移动，你可以设置时间参数。
差不多就是这样了，方法十分简单，

#13

awl8052012-11-21 12:42

觉得占用资源，你可以把循环修正位置放在window。onscroll事件当中，反正差不多就是这样啦，这个是基于单片机的死循环修正原理

你也可以用clearTimeout(t)来结束死循环，当然要在前面用var t=setTimeout();