Disable logo
Closed this issue · 3 comments
I have an issue where the logo doesn't load immediately and only actually appears just before loading my app is done.
Is there a way to disable the logo entirely and only use the html, I tried a couple of things but there is always an empty img tag added to the splash page!
Yep! You can specify a custom template if you like that simply omits the logo, and we should handle that just fine (via the template
option). Here's the default template we use. Try passing this in without the logo, and let me know if that works.
<div class='pg-loading-inner'>
<div class='pg-loading-center-outer'>
<div class='pg-loading-center-middle'>
<h1 class='pg-loading-logo-header'>
<img class='pg-loading-logo'></img>
</h1>
<div class='pg-loading-html'>
</div>
</div>
</div>
</div>
@jhdavids8 Thanks for this nice plugin. I tried to control the logo size using template
option, however once I added this option, it cannot close the loading screen with finish()
command. Is it because it's not an official option?
Yep! You can specify a custom template if you like that simply omits the logo, and we should handle that just fine (via the
template
option). Here's the default template we use. Try passing this in without the logo, and let me know if that works.<div class='pg-loading-inner'> <div class='pg-loading-center-outer'> <div class='pg-loading-center-middle'> <h1 class='pg-loading-logo-header'> <img class='pg-loading-logo'></img> </h1> <div class='pg-loading-html'> </div> </div> </div> </div>
I needed to style image size so it was helpful to see this since it wasn't in the documentation. The value of the template
option should be wrapped in backticks like
pleaseWait({
...,
template: `
<div class='pg-loading-inner'>
<div class='pg-loading-center-outer'>
<div class='pg-loading-center-middle'>
<h1 class='pg-loading-logo-header'>
<img class='pg-loading-logo'></img>
</h1>
<div class='pg-loading-html'>
</div>
</div>
</div>
</div>
`,
...
})