Error con la sincronización de Javascript / Jquery en pestañas inactivas

Recientemente asumí la tarea de crear una animación en Javascript / jQuery. La animación consiste en un círculo que se mueve alrededor del mapa del metro de Londres. Cada vez que pasa una estación, el nombre de la estación está subrayado.

Todavía estoy trabajando en refinarlo y noté que cuando la pestaña está inactiva si se mete el tiempo en la secuencia al volver a la página. Debido a que lo estoy incrustando dentro de un iframe, no parece funcionar cuando lo uso$(window).focus() o$(window).blur().

He animado el círculo usando la función de animación jQuery y simplemente hice la opacidad 0 en todas las líneas debajo del texto y puse demoras en ellas para animar la opacidad a 100. He puesto un enlace a continuación para mostrar la animación como está . Todavía hay problemas con la animación que actualmente estoy ajustando, pero no estoy seguro de cómo solucionar el problema de la pestaña inactiva. Cualquier ayuda sería genial.

sin marco http://www.gbutlercreative.co.uk/london/index.html

con marco http://www.gbutlercreative.co.uk/london/frame.html

Respuestas a la pregunta(1)

Su respuesta a la pregunta