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

怪、怪、怪、牛人人,请帮忙完善代码

2012-06-25 
怪、怪、怪、牛人们,请帮忙完善代码。JScript code[aligncenter]!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1

怪、怪、怪、牛人们,请帮忙完善代码。

JScript code
[align=center]       <!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><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>无标题文档</title><style>#ul1 {background:white; margin:0px; padding:0px; width:500px; height:300px; border:1px solid black; overflow:hidden;}li {border-bottom:1px dashed #CCC; padding:15px 10px 3px 10px; margin:0px; list-style:none;}</style><script type="text/javascript">var arr=['洗脸也能抽筋??', '好冷啊', '一口气睇晒 《碟影重重》三部,头痛痛。一如既往地喜欢特务男,哈哈,有脑有身手', '我靠近你,不是因为你什么都好,不是因为你能给我一个安心而不错的未来,不是因为你是我的老公,不是因为我觉得我们肯定这一辈子会这样好好走下去,不是因为再找一段感情代价太大,而是因为,我爱你,我觉得看到你,就会心动。', '我承认我是个没有鼓励就没有动力的人,缺乏太多毅力。等过了这个冬天。也许我真的能把自己的心收拾干净。空出心里最重要的位置。给自己未来的新娘。剩下的空间,全是梦想,家庭和朋友。'];var t=setInterval(function(){ var sTxt=arr.shift(); createDom(sTxt); arr.push(sTxt);},2000)var bPause=false;function startMove(obj,attr,iTarget,fnMoveEnd){ if(obj.timer) {  clearInterval(obj.timer); } obj.timer=setInterval(function(){  if(bPause)  {   return;  }  doMove(obj,attr,iTarget,fnMoveEnd); },30)};function getAttr(obj,attr){ if(obj.currentStyle) {  return obj.currentStyle[attr]; } else {  return document.defaultView.getComputedStyle(obj,false)[attr]; }}function doMove(obj,attr,iTarget,fnMoveEnd){ var iSpeed=0; var weizhi=0; if(attr=="opacity") {  weizhi=parseFloat(getAttr(obj,"opacity")); } else {  weizhi=parseFloat(getAttr(obj,attr)) } if(Math.abs(iTarget-weizhi)<1/100) {  clearInterval(obj.timer);  obj.timer=null;  if(fnMoveEnd)  {   fnMoveEnd();  } } else {  iSpeed=(iTarget-weizhi)/8;  if(attr=="opacity")  {   obj.style.filter="alpha(opacity:"+(weizhi+iSpeed)*100+")";   obj.style.opacity=weizhi+iSpeed;  }  else  {   iSpeed=iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed);   obj.style[attr]=weizhi+iSpeed+"px";  } }};function leaveMessage(){ var oText=document.getElementById("txt1"); createDom(oText.value); oText.value="";};function createDom(sTxt){ var oUl=document.getElementById("ul1"); var aLi=oUl.getElementsByTagName("li"); var oLi=document.createElement("li");  var iHeight=0; oLi.innerHTML=sTxt; oLi.style.filter="alpha(opacity:0)"; oLi.style.opacity=0;  if(aLi.length) {  oUl.insertBefore(oLi,aLi[0]) } else {  oUl.appendChild(oLi) }  //开始运动 iHeight=oLi.offsetHeight; oLi.style.height="0px"; oLi.style.overflow='hidden'; startMove(oLi,"height",iHeight,function(){  startMove(oLi,"opacity",1) }) oUl.onmouseover=function() {  bPause=true; }; oUl.onmouseout=function() {  bPause=false; }};</script></head><body><ul id="ul1"></ul></body></html>[/align]


为什么以上代码在将鼠标放上去的时候Bug就出现了,鼠标放上去,文字就没出现了,然后就是一大截空白的,给客户的体验非常不友好,移开鼠标又有了,牛人们,能给个解析吗? 怎么解决以上问题呢? 能帮忙改善上面的代码吗? 

牛人们,以上代码就是想模仿新浪微博的那种效果,也就是文字向下滚动的效果,类似于时刻在刷新消息般。

或者牛人们有这种效果的代码,大家可以分享分享。代码量越少越好。

在线等!效果出来了,立马结贴。

[解决办法]
HTML code
<!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>    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />    <title>无标题文档</title>    <style>        #ul1        {            background: white;            margin: 0px;            padding: 0px;            width: 500px;            height: 300px;            border: 1px solid black;            overflow: hidden;        }        li        {            border-bottom: 1px dashed #CCC;            padding: 15px 10px 3px 10px;            margin: 0px;            list-style: none;        }    </style>    <script type="text/javascript">        var arr = ['洗脸也能抽筋??', '好冷啊', '一口气睇晒 《碟影重重》三部,头痛痛。一如既往地喜欢特务男,哈哈,有脑有身手', '我靠近你,不是因为你什么都好,不是因为你能给我一个安心而不错的未来,不是因为你是我的老公,不是因为我觉得我们肯定这一辈子会这样好好走下去,不是因为再找一段感情代价太大,而是因为,我爱你,我觉得看到你,就会心动。', '我承认我是个没有鼓励就没有动力的人,缺乏太多毅力。等过了这个冬天。也许我真的能把自己的心收拾干净。空出心里最重要的位置。给自己未来的新娘。剩下的空间,全是梦想,家庭和朋友。'];        var t = setInterval(f_timer, 2000);        function f_timer() {            var sTxt = arr.shift();            createDom(sTxt);            arr.push(sTxt);        }        var bPause = false;        var isCancel = false;        function startMove(obj, attr, iTarget, fnMoveEnd) {            if (obj.timer) {                clearInterval(obj.timer);            }            obj.timer = setInterval(function() {                if (bPause) {                    clearInterval(t);                    isCancel = true;                    return;                } else {                    if (isCancel)                    { t = setInterval(f_timer, 2000); isCancel = false; }                }                doMove(obj, attr, iTarget, fnMoveEnd);            }, 30)        };        function getAttr(obj, attr) {            if (obj.currentStyle) {                return obj.currentStyle[attr];            }            else {                return document.defaultView.getComputedStyle(obj, false)[attr];            }        }        function doMove(obj, attr, iTarget, fnMoveEnd) {            var iSpeed = 0;            var weizhi = 0;            if (attr == "opacity") {                weizhi = parseFloat(getAttr(obj, "opacity"));            }            else {                weizhi = parseFloat(getAttr(obj, attr))            }            if (Math.abs(iTarget - weizhi) < 1 / 100) {                clearInterval(obj.timer);                obj.timer = null;                if (fnMoveEnd) {                    fnMoveEnd();                }            }            else {                iSpeed = (iTarget - weizhi) / 8;                if (attr == "opacity") {                    obj.style.filter = "alpha(opacity:" + (weizhi + iSpeed) * 100 + ")";                    obj.style.opacity = weizhi + iSpeed;                }                else {                    iSpeed = iSpeed > 0 ? Math.ceil(iSpeed) : Math.floor(iSpeed);                    obj.style[attr] = weizhi + iSpeed + "px";                }            }        };        function leaveMessage() {            var oText = document.getElementById("txt1");            createDom(oText.value);            oText.value = "";        };        function createDom(sTxt) {            var oUl = document.getElementById("ul1");            var aLi = oUl.getElementsByTagName("li");            var oLi = document.createElement("li");                        var iHeight = 50;            oLi.innerHTML = sTxt;            oLi.style.filter = "alpha(opacity:0)";            oLi.style.opacity = 0;            if (aLi.length) {                oUl.insertBefore(oLi, aLi[0]);            }            else {                oUl.appendChild(oLi);            }            //开始运动            iHeight = oLi.offsetHeight;            oLi.style.height = "50px";            oLi.style.overflow = 'hidden';            startMove(oLi, "height", iHeight, function() {                startMove(oLi, "opacity", 1)            })            oUl.onmouseover = function() {                bPause = true;            };            oUl.onmouseout = function() {                bPause = false;            }        };    </script></head><body>    <ul id="ul1">    </ul></body></html> 

热点排行