首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > asp.net >

仿微博的随屏幕滚动内容显示 .net,该怎么解决

2012-04-26 
仿微博的随屏幕滚动内容显示 .net仿微博的随屏幕滚动内容显示 .net有过的吗?高手指教!有过的吗?高手指教!

仿微博的随屏幕滚动内容显示 .net
仿微博的随屏幕滚动内容显示 .net
 
 有过的吗?高手指教!
有过的吗?高手指教!

 思路或代码请贴一下!

[解决办法]
<div stlye="position:fixed;top:0"></div>
就可以了,ie6之外的浏览器都可以,ie6使用脚本实现即可

例子

HTML code
<%@ Page Language="C#" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server">    <title></title></head><body><div style="position:fixed;top:0;border:1px solid red">显示的内容</div>  <form id="form1" runat="server"  style="padding-left:60px;">  <br />dd其他内容  </form></body></html>
[解决办法]
HTML code
<!DOCTYPE HTML><html lang="en-US"><head>    <meta charset="UTF-8" />     <title>仿新浪微博滚动</title>    <style type="text/css">    *{padding:0;margin:0;list-style:none;}    body{margin:0 auto;}    a{text-decoration:none;color:#005EAC;}    #outCont{position:relative;width:500px;height:300px;border:1px solid #333;overflow:hidden;margin:0 auto;}    #outCont ul{position:absolute;padding:20px;}    #outCont li{border-bottom:1px solid #E3EEF8;text-indent:30px;padding:10px 0;}    </style></head><body>    <div id="outCont">        <ul>            <li><a href="#">缓如流水却沁人心脾的生活,静若莲花却永不成成长故事长故... -</a></li>            <li><a href="#">在TB买东西好多年了,记得是在“亲”这个称呼刚开始流行时。一天晚上在家里上网,旺旺突然跳了出来窗口来对我说:“亲,我怀孕了。”哥顿时一惊,心说自己没闯什么祸吧? 正发愣呢,那人又说:“明天去医院检查。” 心想你丫到底是谁,难道还要我陪你去检查,想讹我不成?我可不怕.</a></li>            <li><a href="#">一位西方记者问周总理:“请问总理先生,现在的中国有没有妓女?”不少人纳闷:怎么提这种问题?大家都关注周总理怎样回答。周总理肯定地说:“有!” 全场哗然,议论纷纷。周总理看出了大家的疑惑,补充说了一句:“中国的妓女在我</a></li>            <li><a href="#">1魔法灰姑娘〔超级推荐〕 (安妮海瑟薇主演) 2,贱女孩〔超级推荐〕(林赛罗汉主演) 3,灰姑娘的玻璃手机〔超级推荐〕 4,美人鱼〔超级推荐〕 (里面音乐也很好听) 5,舞出我人生〔超级推荐〕 (励志的!刚出了第二部) </a></li>            <li><a href="#">Tiramisu在意大利原文里,“Tira”是“提、拉”的意思,“Mi”是“我”“Su”是“往上”,合起来就是“拉我起来”的意思;也有另一种解释是“带我走”和“记住我”,带走的不只是美味,</a></li>        </ul>    </div><script type="text/javascript">    function slideDown(ContId,interTime,speed)    {        var d = document;        var contOut = d.getElementById(ContId);        var ul = contOut.getElementsByTagName("ul")[0];                var intval,timeOut,sInterval;        function run(){            intval = setInterval(function(){                var li = contOut.getElementsByTagName("li");                var liNum = li.length;                                                var tempLi = li[liNum-1].cloneNode(true);                var tHeight = li[liNum-1].offsetHeight;                                    ul.insertBefore(tempLi,li[0]);                ul.style.top= -tHeight+"px";                var runDown = function(){                    sInterval = setInterval(function(){                        var uTop = parseInt(ul.offsetTop);                                                                                                                            if(tHeight>0){                                                    ul.style.top = (-(tHeight-1))+"px";                                    //ul.style.top = -(tHeight - Math.ceil(tHeight/10))+"px";                                                        }else{                            ul.style.top = 0+"px";                                clearInterval(sInterval);                        }                        tHeight--;                    },speed);                    ul.removeChild(li[liNum]);                                    }                runDown();            },interTime);        }        run();        function stop(){            clearInterval(intval);                }        contOut.onmouseover = function(){            stop();        }        contOut.onmouseout = function(){            run();                    }    }    slideDown("outCont",5500,20);</script>    </body></html> 


[解决办法]
页面延迟加载数据,原理利用scroll+ajax:
http://justcoding.iteye.com/blog/899250

热点排行