Splash screen with the ArcGIS JS API 4.x?

1731
3
10-03-2017 01:27 PM
NathanSommers1
New Contributor

I'm building a new app with the 4.5 version of the JS API and wondered if anyone knows of a built-in or predefined way to display a splash screen when a user first opens the app.

Tags (2)
0 Kudos
3 Replies
deleted-user-OlpHy1NoMNug
Occasional Contributor II

This isn't exactly a splash screen (more of a preloader) but I found the following tutorials very helpful.

How To Create A CSS3 Spinning Preloader | CSS3 Tutorial 

How To Create A Custom Preloading Screen | CSS3 Tutorial 

Here's the site where we use it, Fall For Greenville.

It took me forever to find something that would work (I know enough programming to be dangerous but couldn't find a full walkthrough) so I'm happy to answer any questions you have.  In our example, instead of the .loading class that he mentions I put this:

$(window).load(function() {
      $('body').addClass('loaded');
});

Scott

NathanSommers1
New Contributor

Thanks for the information, Scott.

I needed something that stayed on the screen so residents could read some simple instructions to help them navigate the new map better. I can make something myself - I just was curious if anyone knew of a way within the JS API to do it.

Also, I really like your search widget. I don't think I've ever come across anyone else who uses that style over the traditional simple search widget. I might have to incorporate that into my maps...

Nathan

0 Kudos
KenBuja
MVP Esteemed Contributor

You can use dijit/Dialog to create a splash screen. This is what I use on my sites for introductory text and instructions.