Javascript error in event handler! Event type = element

I am trying to create a display banner that scrolls the hosting page, see example ... 3. Cut MPU

I used Edge Animate for assembly and javascript to program the functionality (or tried at least), the banner is 300x250px and the image is about 700px, this image animates from top (0px) to bottom (700px) over 4 seconds on the timeline.

The Javascript I'm using has been computed and kindly uploaded here

Amount the user can scroll = 100% / animation length = 100%
Number of users scrolled = 10% / timeline position = 10%

Everything should work correctly, however when I view the composition of the edge wrap in the browser (Chrome) the console log shows ...

Javascript error in event handler! Event Type = element

      

When I add this composition to a test webpage with some fake content, I get the same error as above and also this error when scrolling ...

    Uncaught TypeError: undefined is not a function
getScrollPerc
window.onscroll

      

Javascript is triggered when the error count is counted as I scroll, but I can't figure out how I made the mistake in my code. My code from Edge is below ...

(function($, Edge, compId){
var Composition = Edge.Composition, Symbol = Edge.Symbol; // aliases for commonly used Edge classes

   //Edge symbol: 'stage'
   (function(symbolName) {




      Symbol.bindElementAction(compId, symbolName, "document", "compositionReady", function(sym, e) {

         // insert code to be run when the composition is fully loaded here
         var animSize = getDuration();
         window.onscroll = function(e) {
           var perc = getScrollPerc();
           var animPos = (perc/100) * animSize;
           sym.stop(animPos);
         }

         function getScrollPerc() {
           var wintop = $(window).scrollTop(), docheight = $(document).height(), winheight = $(window).height();
           return (wintop/(docheight-winheight))*100;
         }

         if(getScrollPerc() > 0) {
           console.log('do initial move');
           var perc = getScrollPerc();
           var animPos = (perc/100) * animSize;
           setTimeout(function() { sym.stop(animPos);}, 0);
         }

      });
      //Edge binding end

   })("stage");
   //Edge symbol end:'stage'

})(window.jQuery || AdobeEdge.$, AdobeEdge, "EDGE-4414348");

      

I tried the fix I found on the Adobe forums (not enough reference for a link) that says these functions are only available as part of Ready as it is a local function and adding sym. prefix, they will be available. I, however, have been unable to correct my mistake.

Any information or help on this matter would be appreciated.

Thanks in advance, Adam.

+3
javascript javascript-events event-handling adobe-edge


source to share


No one has answered this question yet

Check out similar questions:

7649
How does JavaScript blocking work?
7494
How can I remove a specific element from an array in JavaScript?
7432
How to check if a string contains a substring in JavaScript?
7428
How can I check if an element is hidden in jQuery?
7287
What does "use strict" do in JavaScript, and what are the reasons for it?
5722
How can I remove a property from a JavaScript object?
5670
Which operator is equal (== vs ===) should be used in JavaScript comparisons?
5101
What's the most efficient way to deeply clone an object in JavaScript?
4829
How do I include a JavaScript file in another JavaScript file?
4380
For each by an array in JavaScript?



All Articles
Loading...
X
Show
Funny
Dev
Pics