main.html

<script>
            window.iFrameResizer = {
                
                // Allows messages from anywhere
                targetOrigin: '*',
                
                // Receiving a message from the parent
                onMessage: function(message) {
                    var messageData = JSON.parse(message);
                  
                    // Check that this message is for this iframe
                    if( messageData["id"] === iframeId ){
                        var sr = messageData["scrollRatio"];
                        var vr = messageData["verticalDisplayRatio"];
                      
                        // Trigger animation
                        if( sr > 0.5 || vr > 0.5 ){
                          animate();
                        }
                      
                        // animateProgressBar(sr);
                    }                    
                },            
            }
            function animate(){
              // do entire animation
            }
  
            function animateProgressBar(percentageComplete){
              // move from current position to percentageComplete
            }    
</script>