0

im test new template and using camljs lib.

next step to read javascript not work a loop, becouse read htmlcollection aint return length.

i can view returns only refreshing with ctrl+F5 or ctrl+shift+R in chrome.

function click() {          
            console.log('teste de documento',document.querySelectorAll( '.morph-button' ));
            var len = document.getElementsByClassName( 'morph-button' );
            console.log('teste de documento', len.length);

            var nodes = document.querySelectorAll( '.morph-button' );
                var docElem = window.document.documentElement, didScroll, scrollPosition;


                function noScrollFn() {
                    window.scrollTo( scrollPosition ? scrollPosition.x : 0, scrollPosition ? scrollPosition.y : 0 );
                }

                function noScroll() {
                    window.removeEventListener( 'scroll', scrollHandler );
                    window.addEventListener( 'scroll', noScrollFn );

                }

                function scrollFn() {
                    window.addEventListener( 'scroll', scrollHandler );
                }

                function canScroll() {
                    window.removeEventListener( 'scroll', noScrollFn );
                    scrollFn();
                }

                function scrollHandler() {
                    if( !didScroll ) {
                        didScroll = true;
                        setTimeout( function() { scrollPage(); }, 60 );
                    }
                };

                function scrollPage() {
                    scrollPosition = { x : window.pageXOffset || docElem.scrollLeft, y : window.pageYOffset || docElem.scrollTop };
                    didScroll = false;
                };

                scrollFn();


                console.log('this', this.target);
                console.log('state2', document.readyState);

                    var list = document.getElementsByClassName('morph-button');
                    console.log('list', list.length);

                   // var i;

                    for (var i = 0; i < list.length; i++) {
                        console.log('list iteration', list);
                        console.log('list index', i);

                        new UIMorphingButton( list[i], {
                            closeEl: '.icon-close',
                            onBeforeOpen: function () {

                                noScroll();

                            },
                            onAfterOpen: function () {

                                canScroll();

                            },
                            onBeforeClose: function () {

                                noScroll();

                            },
                            onAfterClose: function () {

                                canScroll();

                            }
                        });

                    }

}
window.onload = click;
  • 1
    Does the site you are running this on have the Minimal Download Strategy feature enabled? – Dylan Cristy Feb 21 at 19:43
  • Hey @DylanCristy, it is disable. – Fernando Santana Feb 21 at 19:52
  • @DylanCristy i resolve the problem, thank you. – Fernando Santana Feb 22 at 12:39
0

[resolved]

hey, i resolved the problem with MutationOberver

                var divArray = document.getElementById('atividades');

                var observer = new MutationObserver(function(){
                   console.log('observer1', document.getElementsByClassName('morph-button').length);
                   console.log('observer2',document.getElementsByClassName('morph-button'));

                   var list = document.getElementsByClassName('morph-button');
                    console.log('list', list.length);

                   // var i;

                    for (var i = 0; i < list.length; i++) {
                        console.log('list iteration', list);
                        console.log('list index', i);

                        new UIMorphingButton( list[i], {
                            closeEl: '.icon-close',
                            onBeforeOpen: function () {

                                noScroll();

                            },
                            onAfterOpen: function () {

                                canScroll();

                            },
                            onBeforeClose: function () {

                                noScroll();

                            },
                            onAfterClose: function () {

                                canScroll();

                            }
                        });

                    }

                });

                observer.observe(divArray, { attributes: false, childList: true, subtree: true });

                // When you've got what you need, you should call this function to trigger a disconnect 
                function classesFound(){
                   observer.disconnect();
                };

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.