0 Replies Latest reply: Apr 13, 2013 3:53 PM by zenbend
zenbend Level 1 Level 1

I'm new to iBooks Author but thought I followed these instructions (http://support.apple.com/kb/HT5068?viewlocale=en_US&locale=en_US) to open an HTML widget without the white flicker faithfully. But the widget.notifyContentIsReady() javascript command isn't firing as I expected. Am I missing something obvious here? Here are the details of my test custom widget project...


To my widget's Info.plist, I added:





To my main html file, I added the reference to the Apple file:


<script type="text/javascript" src="AppleClasses/AppleWidget.js"> </script>


To my main HTML file I also added the call to:



Below is the HTML code/Javascript in total. I expected this code would cause the Widget to keep showing the Default.png file for about 5 seconds until widget.notifyContentIsReady() is called.  But it doesn't. Instead, the Default.png disappears almost immediately and then five seconds later the test message gets swapped out.


<!DOCTYPE html>



          <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

          <meta http-equiv="X-UA-Compatible" content="chrome=1,IE=edge" />

          <meta name="viewport" content="user-scalable=yes, width=1024" />


          <script type="text/javascript" src="AppleClasses/AppleWidget.js"> </script>

          <script type="text/javascript">

                    window.onload = function ()&#8232; {

                              var div = document.getElementById("IBPreload");


                              var slowdown = setTimeout(imready,3000);




                    function imready(){

                              var div = document.getElementById("message");

                              div.innerHTML="hi from inside this iPad!";





          body {

                    background: #ffffff;

                    margin: 0px;


          #item {









            <div id="IBPreload">

                    <img src="Default.png">


          <div style ="margin:auto;width=1024;">

                    <div id="message" style="position:absolute; top:0px; left:0px; ">Wow!</div>





Maybe I've been staring at this too long. Is my understanding of widget.notifyContentIsReady correct? Shouldn't iBooks wait to render the HTML until I've called widget.notifyContentIsReady? Any ideas? Help.

iBooks Author