- ✅ reduced bandwidth
- ✅ weak hardware
- ✅ unsupported browser
occurs, the process is paused and only continued or cancelled after a user interaction in the layer.
The content contains messages and buttons that are displayed in the respective event. Messages and buttons are defined with an
id, these are set to
display: none; by default via CSS.
For the closing mechanism of the layer, see Hide Layer.
The messages are elements that are displayed for the relevant events.
Initially, all IDs are set to
display: none;, so no message is visible.
When an event is triggered, the relevant message is displayed via the ID using the style attribute
|Connection bandwidth is too low.|
|User hardware are not sufficient.|
|User Browser is not supported by |
<!-- initial --> <div id="nuxt-speedkit-message-unsupported-browser"> Your browser is not supported! </div> <!-- active --> <div id="nuxt-speedkit-message-unsupported-browser" style="display: block;"> Your browser is not supported! </div>
The buttons are interaction elements for the user with which he can make his choice at the relevant event.
Initially, all IDs except for
nuxt-speedkit-button-nojs are set to
display: none;. When an event is triggered, the relevant button is displayed via the ID using the style attribute
It is recommended to register an Inline Click-Event for the buttons
More information under Force App initialization
<label for="nuxt-speedkit-layer-close"> Close Layer </label>
The layer can be closed via a
for attribute with the
Force App initialization
For Unsupported-Browser and Insufficient Hardware events, an
onclick event must also be set with the
In the event, the global variable
__NUXT_SPEEDKIT_AUTO_INIT__ must be set to