Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Callback: how to use? #119

Open
lordthistle opened this issue Feb 6, 2018 · 0 comments
Open

Callback: how to use? #119

lordthistle opened this issue Feb 6, 2018 · 0 comments

Comments

@lordthistle
Copy link

I am not able to have callback working. Unfortunately, I am not able to create a jsFiddle with a working textillate example, however I created this minimal code for reproducing the issue

In a HTML page I have these two spans:

<span class='tlt' style='visibility:hidden'>123456</span>
<span class='tlt' style = 'visibility:hidden'>789</span>

At the end of the HTML text I have:

<script>
        $(document).ready(function() {  
            magic_init();
        });
</script>

The function magic_init() is:

function magic_init() {
    elems = $('.tlt')
    n = $(elems).length
    
    console.log(n + ' to be animated')
    _textillate(elems, 0, n)
} // magic_init

function _textillate(elems, idx, maxIdx) {
    e = $(elems)[idx];
    if (idx < maxIdx-1) {
        console.log('Animating #' + idx + "/" + maxIdx)
        $(e).textillate({ in: { effect: 'rollIn',  callback: function() {console.log('callback'); }} });
    } else {
        $(e).textillate({ in: { effect: 'rollIn', } });
    }
}

With this I am able to animate only the first element, the console log contains only:

2 to be animated
Animating #0/2

Neither the second span is animated nor the callback message is logged

Is there anyone who can help me?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant