Question

我有这个代码我已经完成了，它是测试png strip它显示它动画，但它只适用于1 png条带我有，任何其他我尝试它不工作，这里是下面的代码有卢布放入代码，这里是一个带代码的pastebin链接 http://pastebin.com/rXUj9X5W看看我的意思你可以在http://xatwebs.co/test.php尝试使用此图片来了解我的意思www.xatwebs.co/test.png并且此图片与其他人一起工作www.imagizer .imageshack.us / V2 / 6570x30q90 / 538 / zyzaE7.png 代码：

<?php error_reporting(0); 
if (!isset($_POST['submit'])) {
 ?>
<center><p>Test</p></center>
<center><form method="get" action="<?php echo $_SERVER['PHP_SELF']; ?>">
Image: <input type="text" name="image" size="5">
<br/>
<input type="submit" value="Go!">
</form></center>
<?php
}
?>
<?php

$image = $_GET['image'];
list($width, $height) = getimagesize(''.$image.'');
if ($image == null) {
die("<center>Enter an image..</center>");
}

else {
$css = '
<style type="text/css">
.hi {
background-image:url("'.$image.'");
width:30px;
height:30px;
margin:auto;
-webkit-animation: hi .8s steps(10) infinite;
-moz-animation: hi .8s steps(10) infinite;
-ms-animation: hi .8s steps(10) infinite;
-o-animation: hi .8s steps(10) infinite;
animation: hi .8s steps(10) infinite;
}
-webkit-keyframes hi {  
from { background-position: 0px; } 
to { background-position: -'.$width.'px; } 
}
@-moz-keyframes hi {  
from { background-position: 0px; } 
to { background-position: -'.$width.'px; } 
} 
@-ms-keyframes hi {  
from { background-position: 0px; } 
to { background-position: -'.$width.'px; }  
}
@-o-keyframes hi {  
from { background-position: 0px; } 
to { background-position: -'.$width.'px; }  
} 
@keyframes hi {  
from { background-position: 0px; } 
to { background-position: -'.$width.'px; } 
}
</style>
';
    echo ''.$css.'<br><img src='.$image.' /><br><div class="hi"></div>';
}
?>

CSS png精灵测试仪

0 个答案: