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

js有关问题 高手

2014-01-17 
js问题 求助高手这个是像百度百科首页词条统计的js,但是它只能随机显示数字,不能自定义自己想要显示的数字

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个数组何在一起再拆分成数组就行了,注意存放数字的容器不要少了,先后循序也不要搞错

热点排行