The Intro Splash widget triggers a rapid sequence of full screen image layers at the click of a button or when set as a page preloader. Consider using on a splash page or when entering a portfolio gallery.
Widget Compatibility: Highly Compatible (No known issues when combining with other MuseThemes widgets)
Current Version: 1.0
Supported Devices: Desktop, Tablet, Phone
1.0: Initial release
Setup in Muse
Place the widget on your site. We suggest placing the widget off canvas and out of the way.
Open the widget option panel.
Mode: There are two widget modes: _Button Transition and Page Preloader_
Button Transition uses a button to trigger the image animation sequence.
Page Preloader triggers the image animation sequence upon page load. In this mode, the sequence will be displayed once on page load and again if the page is refreshed or reloaded.
Preloader Background Color: This sets the background color for the Page Preloader mode. This color will be seen briefly before the animation sequence, while the images are loaded by the browser. This setting will only be accessible when the Page Preloader mode is selected.
Button Graphic Style: This graphic style links a button with the widget. To use, apply a graphic style to any button then enter the graphic style name in this field. This setting will only be accessible when the Button Transition mode is selected.
Image Animation Duration: This is the amount of time it takes to complete the transition of an image.
Image Animation Delay: This is the delay before each image is transitioned. Longer times will increase the amount of time between image transitions.
Images Section: This section allows you to load images into the widget. Simply enable the number of images you wish to use, and click Add Image to load the images.
It is important to optimize the images you use in this widget. Keep in mind that even though the image sequence happens quickly, the browser must load all of the images before starting the image sequence. Large images will cause a delay as the browser must load the images.
To optimize images, begin by reducing the image dimensions to a web-friendly size, such as 1500px on the long edge. Then process your images with an image optimizer such as jpegmini or tinyjpg. You may also reduce image file sizes using your photo editor, such as Photoshop. Aim to keep images under 250kb or so.