When creating animations for iBook, svg images must not be in <img> tags. <embed> tags seem to work correctly.

svg images are not visible in widgets in iBook web pages if they are displayed using an <img> tag, svg images displayed via the <embed> tag work.

I've been able to get animated svg widgets to work in iBook with Sencha Animator, but you must to hack the generated index.html to have the svg images included with an <embed> tag vs. the <img> tag that Sencha generates.

If you look toward the bottom of the Sencha generated html, you will find <div> tags for each asset. For example, svg image tags like this:

<div id="an-obj-9"><div><img height="80" width="68" src="assets/fish.svg"></div></div>

Need to be modified like so:

<div id="an-obj-9"><div><embed height="80" width="68" src="assets/fish.svg"></div></div>

I haven't investigated the implications of changing <img> tags to <embed> tags this way, so your mileage my vary.

There are a number of permutations for displaying and scaling svg images on a web page. I found a post on edutechwiki.unige.ch helpful in this regard, see http://edutechwiki.unige.ch/en/Using...HTML5_tutorial. Information at http://sci-fi-o-rama.net/jquery_mob_...ascript_2.html is also very helpful.