Home Jquery Scripts Display Content Confirmation Dialog Alert | Vertical Slide onFocus

Display Content Confirmation Dialog Alert | Vertical Slide onFocus

Jquery Scripts webcodeflow · October 31, 2022 · 0 Comment

Vertical Slide is a jQuery-based multi-browser vision monitor that can be used to detect whether an object is visible in the viewport and trigger functions when the object is scrolled and allows you to view content like text or youtube movie after alert confirmation dialog or popup.

How to make use of it:

1. Insert the vslide.js script into the webpage which has the jQuery library loaded.

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/vslide.js"></script>

2. Attach the function VisibilityMonitor to the target.

<div id="triggerdiv">
  Element
</div>

VisibilityMonitor(
  document.getElementById('triggerdiv')
);

3. Find out the callback capabilities to be triggered because the component is scrolled in or outside of view.

VisibilityMonitor(
  document.getElementById('triggerdiv'),
  function() {
    // element is visible
  function() {
    // element is scrolled out of view
  }
);

Element Visibility Monitor In jQuery, Vertical Slide Plugin/Github, confirmation dialog box, custom alert dialog