读书人

js有关问题 高手

发布时间: 2014-01-17 15:01:00 作者: rapoo

js问题 求助高手
这个是像百度百科首页词条统计的js,但是它只能随机显示数字,不能自定义自己想要显示的数字,请教高手帮忙修改一下,我想让已有用户显示的数字为13567 词条贡献显示的数字为325786 真心请高手帮忙修改一下,谢谢了

<html>
<head>
<meta charset="utf-8">
<title>仿百度百科</title>
<style>
*{margin:0; padding:0;}
body{background:#ecf5fc;}
i,em{padding-right:3px;}
#wrap{width:740px; height:240px; position:relative; margin:0 auto; background:url(images/br.jpg) no-repeat;}
.supply{width:78px; height:181px; position:absolute; left:-78px; background:url(images/bg_l.jpg) no-repeat;}
.usersum{position:absolute; top:165px; left:33px; font-size:14px; color:#7e878c; width:539px; height:35px;}
.usersum em{float:left; margin-top:12px; font-style:normal; color:#7e878c;}
.usersum user{float:left; margin:0 10px;}
.usersum entry{float:left; margin:0 10px;}
.usersum .number{float:left; width:24px; height:35px; background:url(images/number.png) 0px 0px no-repeat; margin:0 1px 0 0;}
.usersum .comma{background:url(images/number.png) -18px -350px no-repeat; width:6px; height:7px;margin:28px 1px 0 0; overflow: hidden; float:left;}
</style>
<script>
function getByClass(oParent,sClass)
{
var aEle=oParent.getElementsByTagName("*");
var aResult=[];
var re=new RegExp("\\b"+sClass+"\\b");

for(var i=0;i<aEle.length;i++)
{
if(re.test(aEle[i].className))
{
aResult.push(aEle[i]);
}
}

return aResult;
}

function getStyle(obj,name)
{
if(obj.currentStyle)
{
return obj.currentStyle[name];
}
else
{
//对火狐下取backgroundPositioY的值特别处理一下
if(name=="backgroundPositionX")
{
if(window.navigator.userAgent.indexOf("Firefox")!=-1)//火狐
{
return parseInt(getComputedStyle(obj,false).backgroundPosition);
}
else
{
return getComputedStyle(obj,false)[name];
}
}
else if(name=="backgroundPositionY")
{
if(window.navigator.userAgent.indexOf("Firefox")!=-1)//火狐
{
return getComputedStyle(obj,false).backgroundPosition.split(" ")[1];
}
else
{
return getComputedStyle(obj,false)[name];
}
}
else
{
return getComputedStyle(obj,false)[name];
}
}
}

function startMove(obj,json,interval,type,fnEnd)
{
var stressSpeed=0;
var pattern={};

for(var attr in json)
{
pattern[attr]=parseInt(getStyle(obj,attr));
}

clearInterval(obj.timer);
obj.timer=setInterval(function(){
var bEnd=true;

for(var attr in json)
{
switch(type)
{
case "stress":
stressSpeed+=(json[attr]-pattern[attr])/10;
stressSpeed*=0.75;

pattern[attr]+=stressSpeed;

obj.style[attr]=pattern[attr]+"px";

if(Math.abs(pattern[attr]-json[attr])>0.1&&Math.abs(stressSpeed)>0.1)
{
bEnd=false;
}

break;

case "buffer":
var cur=0;

if(attr=="opacity")
{
cur=Math.round(parseFloat(getStyle(obj,attr))*100);
}
else
{
cur=parseInt(getStyle(obj,attr));
}

var bufferSpeed=(json[attr]-cur)/8;
bufferSpeed=bufferSpeed>0?Math.ceil(bufferSpeed):Math.floor(bufferSpeed);

if(attr=="opacity")
{
obj.style.opacity=(cur+bufferSpeed)/100;
obj.style.filter="alpha:(opacity="+(cur+bufferSpeed)+")";
}
else
{
if((attr=="backgroundPositionX"||attr=="backgroundPositionY")&&window.navigator.userAgent.indexOf("Firefox")!=-1)
{
if(attr=="backgroundPositionX")
{
var y=getStyle(obj,"backgroundPositionY");
obj.style.backgroundPosition=cur+bufferSpeed+" "+y+"px";
}
else
{
var x=getStyle(obj,"backgroundPositionX");
obj.style.backgroundPosition=x+"px "+(cur+bufferSpeed)+"px";
}
}
else
{
obj.style[attr]=cur+bufferSpeed+"px";
}
}

if(cur!=json[attr])
{
bEnd=false;
}

break;
}
}

if(bEnd)
{
clearInterval(obj.timer);

for(var attr in json)
{
obj.style[attr]=json[attr]+"px";
}

if(fnEnd)
{
fnEnd();
}
}

},interval);
}

window.onload=function()
{
var numberHeight=35;
var aNumber=getByClass(document,"number")


for(var i=0;i<aNumber.length;i++)
{
var number=parseInt(Math.random()*10);//生成个0-9之间的数字

startMove(aNumber[i],{backgroundPositionY:-number*35},30,"buffer");
}
};
</script>
</head>

<body>
<div id="wrap">
<div class="supply"></div>
<div class="usersum">


<em>已由</em>
<div class="user">
<span class="number"></span>
<span class="comma"></span>
<span class="number"></span>
<span class="number"></span>
<span class="number"></span>
<span class="comma"></span>
<span class="number"></span>
<span class="number"></span>
<span class="number"></span>
</div>
<em>用户</em>
<div class="entry"><em>贡献</em>

<span class="number"></span>
<span class="comma"></span>
<span class="number"></span>
<span class="number"></span>
<span class="number"></span>
<span class="comma"></span>
<span class="number"></span>
<span class="number"></span>
<span class="number"></span>
</div>
<em>词条</em>
</div>
</div>
</body>
</html>


[解决办法]
本帖最后由 showbo 于 2014-01-14 16:40:27 编辑 window.onload = function () {
var numberHeight = 35;
var aNumber = getByClass(document, "number")

var s = '13567325786'.split('');
for (var i = 0; i < aNumber.length; i++) {
var number = s[i];

startMove(aNumber[i], { backgroundPositionY: -number * 35 }, 30, "buffer");
}
};

没图片,看不到效果,你的2个数组何在一起再拆分成数组就行了,注意存放数字的容器不要少了,先后循序也不要搞错

读书人网 >JavaScript

热点推荐