CODEWITHSUNDEEP
javascript
Jandon
Jandon

Reputation: 625

Avoid reload on click

I wrote a code to reload my page when the user resize his window. But I got a conflict with a flipbook when the user wants to display it in fullscreen mode.

When the user click on the fullscreen button the page is reloaded.

How to avoid a reload of my page when the user click on the fullscreen mode button ? Thank you in advance.

var breakpoint_width = 1199;

window.addEventListener('resize', function(event) {
    if ($('.page-single').length > 0 && $win.width() > breakpoint_width) {
        clearTimeout(resizeTimeout);
        resizeTimeout = setTimeout(function() {
            window.location.reload();
        }, 200);
    }
});

Upvotes: 0

Views: 100

Answers (1)

Peter
Peter

Reputation: 1931

Just so a check to determine if action is from open full screen or resize.

I update my answer since you are using jQuery.

   var breakpoint_width = 1199;
   window.IsClicked = false;

    window.addEventListener('resize', function(event) {
        if (!window.IsClicked && $('.page-single').length > 0 && $win.width() > breakpoint_width) {
            clearTimeout(resizeTimeout);
            resizeTimeout = setTimeout(function() {
                window.location.reload();
            }, 200);
        }
    });

    $(".ti-fullscreen").on("click", function(event) {
     window.IsClicked = true;
     //Then do full screen
    });

You can also add another event when close fullscreen is clicked or exit fullscreen.

  $(".exit-fullscreen").on("click", function(event) {
     window.IsClicked = false;
     //Then do exit full screen
    });

Upvotes: 1

Related Questions