Skip to content

animation queue not working #84

@anybany

Description

@anybany

Hi i am trying to achieve an animnation queue but it always only plays the second animation "VorhangAuf".
Can anyone please tell me what i am doing wrong?

here is my code:

jQuery(document).ready(function($) {

	var headerHeight = $('#vorhangHeader .elementor-row').height();
	var supportedFlag = $.keyframe.isSupported();

	$.keyframe.define([{
		name: 'VorhangZu',
		'0%': {
			'min-height': headerHeight
		},
		'100%': {
			'min-height': '100vh'
		}
	}, {
		name: 'VorhangAuf',
		'0%': {
			'min-height': '100vh'
		},
		'100%': {
			'min-height': headerHeight
		}
	}]);
      
	const vorhang = new Keyframes(document.getElementById('vorhangHeader').getElementsByClassName('elementor-container')[0]);
      
	vorhang.queue('VorhangZu 300ms cubic-bezier(.83,.03,.24,.65) 0s forwards', {
		onBeforeStart: () => {
			console.log('onBeforeStart 1');
		},
		onStart: () => {
                          console.log('onStart 1');
		},
		onEnd: () => {
			console.log('onEnd 1');
		}
	})
	.queue('VorhangAuf 2s cubic-bezier(.33,.01,0,.99) 2s forwards', {
		onBeforeStart: () => {
			console.log('onBeforeStart 2');
		},
		onStart: () => {
                         console.log('onStart 2');
		},
		onEnd: () => {
			console.log('onEnd 2');
		}
	});

});

in console i get this error and the following logs:

keyframes.js:143 Uncaught ReferenceError: exports is not defined
onBeforeStart 1
onBeforeStart 2
onStart 1
onStart 2
onEnd 2

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions