这段代码在IE9中能动在Chrome浏览器中无法动。该怎么解决-JavaSript-爱易网页

这段代码在IE9中能动在Chrome浏览器中无法动。该怎么解决

日期：2014-05-16　浏览次数：20507 次

这段代码在IE9中能动在Chrome浏览器中无法动。
css.css外部样式表

CSS code

/*水平翻转*/
.flipx {
    -moz-transform:scaleX(-1);
    -webkit-transform:scaleX(-1);
    -o-transform:scaleX(-1);
    transform:scaleX(-1);
    /*IE*/
    filter:FlipH;
}

/*垂直翻转*/
.flipy {
    -moz-transform:scaleY(-1);
    -webkit-transform:scaleY(-1);
    -o-transform:scaleY(-1);
    transform:scaleY(-1);
    /*IE*/
    filter:FlipV;
}

* {margin:0,0}

.box{
    margin:100px 300px;
    width:500px;
    height:300px;
    border:1px solid blue;
    background-color:#B4CDCD;
    position:absolute;
}

#pic{
    position:absolute;
    left:0;
    top:0;
    border:1px solid red;
    
}
.ctrl{
    margin:50px auto 0 auto;
    width:502px;
    text-align:center;
}

js.js外部文件

JScript code

function Dog()
{
    this.move=function(n)
    {
        this.x=0;
        this.y=0;
        switch(n)
        {
            case 0:
                var p=document.getElementById('pic');
                var top=p.currentStyle.top;
                top=parseInt(top.substr(0,top.length-2));
                p.style.top=(top-10)+"px";
                break;
            case 1:
                var p=document.getElementById('pic');
                var top=p.currentStyle.top;
                top=parseInt(top.substr(0,top.length-2));
                p.style.top=(top+10)+"px";
                break
            case 2:
                var p=document.getElementById('pic');
                var left=p.currentStyle.left;
                left=parseInt(left.substr(0,left.length-2));
                p.style.left=(left+10)+"px";
                break;
            case 3:
                var p=document.getElementById('pic');
                var left=p.currentStyle.left;
                left=parseInt(left.substr(0,left.length-2));
                p.style.left=(left-10)+"px";
                break
        }
    }
}

var dog=new Dog();

function move(n)
{    
    switch(n)
        {
            case 0:
                dog.move(n);
                break
            case 1:
                dog.move(n);
                break
            case 2:
                dog.move(n);
                break
            case 3:
                dog.move(n);
                break
        }
}

html

HTML code

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>

<head>
<script type="text/javascript" src="./js/js.js" ></script>
<link rel="stylesheet" type="text/css" href="./css/css.css" />
</head>

<body>
    <div class="box"><img id="pic" class="flipx" src="./img/dog.gif" /></div>
    <div class="ctrl">
        <input type="button" name="up" value="上" onclick="move(0)" />
        <input type="button" name="down" value="下" onclick="move(1)" />
        <input type="button" name="left" value="左" onclick="move(2)" />
        <input type="button" name="right" value="右" onclick="move(3)" />
    </div>
</body>

</html>

------解决方案--------------------
p.style.left=(left-10)+"px";
这里应该有问题吧，如果是 = 后面就不要px,如果后面有px，就用:
p.style.lfet:(left-10)+"px

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

这段代码在IE9中能动在Chrome浏览器中无法动。该怎么解决

相关资料更多>

推荐阅读更多>