RE: brainstorming -- SVG -- SMIL-like declarations in HTML

I mentioned earlier today that I hoped to give some specificity to the sorts of things I was hoping for vis a vis declarative animation -- SMIL like stuff.
 
I should preface these remarks by saying I'm not sure if consensus has been established anywhere yet on how one assigns colors to an identified object in a web page.
1. 
<div id="Q" style="background:red">
<div id="Q" bgcolor="red">
<div id="Q" onbuild="function (){this.color="red"}>
I don't really care how we end up doing it (though I will express dismay at the oddities associated with doing it at the current time)
 
Nor do I know if there is a common understanding about how one is expected to rotate an image in a web page:
 
2.
<div style="rotate:2*pi/5"><img src="Q.jpg"></div>??
 
The last time I looked into it was some years ago. It seems as though IE had one way to do it and Netscape didn't, but I don't really remember. One ought to be able to rotate an image, it seems, though this isn't the point.
 
There does seem to be a way to translate things:
 
3.
<div id="Q" style="position:absolute;left:200;top:100"><img src="Q.jpg"></div>
 
( I will hope that someone can tell me it is easier than this in some existing standard -- since it seems a bit cumbersome)
 
So let's assume in some standardized markup syntax, we have a way of specifying color, rotation and position of the content in a div tag and let us, for sake of glossing over the exact nature of that syntax, encode the pseudo-markup as:
<pseudo>
1.
<div><style color="red"></div>
 
2. 
<div><style rotation="72"><img src="Q.jpg"></style></div>
 
3. 
<div><style x="50%" y="100"><img src="Q.jpg"></style></div>
</pseudo>
 
Then why can't we let people do something like:
 
<pseudo>
1. <div><style color="red">

    <animate attributeName="color"  dur="15s" 

     values="green;yellow;magenta;white;cyan " repeatCount="indefinite"/>

</style>

</div>
 
2. <div><style rotation="72"><animate attributeName="rotation"  dur="15s" 

     values="35;0;35" repeatCount="indefinite"/>

<img src="Q.jpg"></style></div>
 
(again this is pseudo-markup -- the way of doing this in SVG would be to use an animateTransform)
 
3. 
<div><style x="50%" y="100">
<animate attributeName="x"  dur="15s" 

     values="10%;90%;10%" repeatCount="indefinite"/>

<img src="Q.jpg">
</style></div>
 
</pseudo>
 
with results much as one would expect in SVG/SMIL as seen in Opera or IE/ASV?
 
I don't think there are any halting problems embedded in the above, since Opera and Adobe have managed to make it work in their SVG implementations.
 
The code, involved in such declarative animations (I think most would agree) would be a whole lot simpler than what is involved in doing it with script (see http://srufaculty.sru.edu/david.dailey/pictures/graphics.htm as a simple example of rotating and translating "an image" with event handlers.)
 
David Dailey

Received on Monday, 26 March 2007 01:54:56 UTC