batiste / sprite.js

An efficient javascript sprite animation framework

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

An animated image that scales

atreeon opened this issue · comments

Many thanks for this tool :-) I have converted an old swf animated image using swf quicker which converts the file into a html file that uses sprite.js to animate it (I couldn't find another way to successfully convert these old swf animations!)

I find that the animated image does not scale automatically when the browser's dimensions are expanded or reduced; the dimensions are fixed.

Is there a way to do this? I'm really a bit lost at stage one, I don't even know whether the data is a properietary format, canvas or something else

Here is a sample of the html file that was produced (with the data being accepted by sprite.js). Many thanks

Here is a link to a file created by swf quicker

https://firebasestorage.googleapis.com/v0/b/adi200wad.appspot.com/o/demo2%2Fbifteck.html?alt=media&token=e9d00693-d4ac-4a07-8dd1-ff08ef456a34

and a sample

<body style="overflow:hidden;">
	<script>var data ={

"BackgroundColor" : "#FFFFFF",
"FileVersion" : "6",
"FrameCount" : "13",
"FrameHeight" : "400",
"FrameRate" : 25.0,
"FrameWidth" : "300",
"FrameRect" : {
"xmax" : 300,
"xmin" : 0,
"ymax" : 400,
"ymin" : 0
},
"MainFrame" : {
"type" : 39,
"ShowFrame" : [
{
"depth" : 3,
"id" : "1",
"matrix" : "1,0,0,1,0,0",
"name" : "",
"replace" : true,
"type" : 26
},
{
"depth" : 4,
"id" : "2",
"matrix" : "1,0,0,1,0,0",
"name" : "",
"replace" : true,
"type" : 26
},

I got it, I updated sprite.js and added these lines


        b.root.setAttribute("viewBox", "0 0 490 417"); 
        b.root.setAttribute("preserveAspectRatio", "meet"); 

It is just svg under the hood :-)