Show / hide preloader on page load

hi , i want to show a preloader over all the contents when page is loading and hide it when the page load is finished and show the content (im not talking about internal links … like when you type address in the browser and waiting for the page to load )
like this demo
https://demo.app-framework.com/

i’ve tryid this

var app = new Framework7({
  // App root element
  root: '#app',
  // App Name
  name: 'My App',
  // App id
  id: 'com.myapp.test',

    on: {
        init: function () {
            console.log('App initialized');
        },
        pageInit: function () {
            console.log('Page initialized');
            app.preloader.hide();
        },
    }
  // ... other parameters
});

var mainView = app.views.create('.view-main');
app.preloader.show();

but it doesnt work , im not sure if its something possible … i appreciated if someone point me to the right direction

1 Like