0

The thing is, i'm adding Annotorious to my openSeadragon project. http://annotorious.github.io/demos/openseadragon-preview.html to get this plugins start, Following are the options.

<script>
  function init() {
    anno.makeAnnotatable(document.getElementById('myImage'));
  }
</script>
...
<body onload="init();">
  <img src="example.jpg" id="myImage" />
</body>

Here is the problem, i use these to delay the loading of javascript on the viewer block.

<script type="text/javascript">
 if (window.addEventListener)
        window.addEventListener("load", downloadJSAtOnload, false);
    else if (window.attachEvent)
        window.attachEvent("onload", downloadJSAtOnload);
    else window.onload = downloadJSAtOnload;
</script>
Once i add onload="init();" to my code.the viewer won't function.

Are there conflicts between these two? if so, how to solve it?

ho.yq
  • 1
  • 1

3 Answers3

0

I think this should help:

<script type="text/javascript">
 var htmlOnLoad = window.onload;
 window.onload = function(e){htmlOnLoad(e); downloadJSAtOnload(e)};
</script>

The idea is to keep the handler bound with HTML and call both: the html- and js- handlers.

ptrk
  • 1,800
  • 1
  • 15
  • 24
  • That won't help. This tries to use objects created by scripts which not only haven't finished downloading, but haven't started downloading. That will throw an exception so `downloadJSAtOnload` won't even run. – Quentin Mar 29 '16 at 09:38
  • What scripts haven't finished downloading? The only assumption here is that the function downloadJSAtOnload is defined. – ptrk Mar 29 '16 at 09:46
  • — The ones that `downloadJSAtOnload` causes to download and that `htmlOnLoad` depends on. – Quentin Mar 29 '16 at 09:47
  • If you consider the whole context, agreed - it will not work. The question was about init() not running, maybe a misunderstanding because it actually run throwing the exception. – ptrk Mar 29 '16 at 09:49
0

Onload behavior is like so: (probably depends on the browser type - behavior will might change - I worked on chrome)

  1. If you set body onload="_fn" it will work on page loads
  2. If you add window.onload=_fn on top of the page script (before the body tag) they will both load (2 then 1)
  3. If you will add window.onload on the most bottom area of the HTML. It will be the only one to be executed on page load. (body "onload" will be override)
  4. Adding an event listener to the window - you can add as much as you need and they will all be loaded as ordered respectively.
lastboy
  • 566
  • 4
  • 12
0

When the load event fires you are trying to do two things:

  • Call init (which, in turn, calls anno.makeAnnotatable)
  • Asynchronously load the JavaScript which makes anno.makeAnnotatable available

You can't call the function before it exists. You have to delay the calling of init until the loading of the JS that downloadJSAtOnload triggers has finished. (The specifics of that depend on how downloadJSAtOnload works).

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335