ic-trigger-on - The Trigger On Attribute

Summary

The ic-trigger-on attribute tells Intercooler to load the content of a ic-src attribute when a given event occurs.

This can be used to implement infinite scrolling, lazy loading of elements, etc.

Syntax

The value of the attribute should be a valid JQuery event:

http://api.jquery.com/category/events/

The special event scrolled-into-view will fire when an element first scrolls into view.

The special event timeout allows you to trigger the request after a given interval (e.g. timeout:400ms will fire after 400 milliseconds

The changed modifier can be added after the event name and a space. Intercooler will only trigger a request if the value of the element in question has changed if this modifier is present.

The once modifier can be added after the event name and a space. Intercooler will only trigger a request once for the given event if this modifier is present.

Server Sent Events

If a parent element has an ic-sse-src attribute on it, it is possible to use server sent events to trigger an element by using the sse: prefix, followed by the event name.

See the documentation for more details.

Dependencies

ic-trigger-on has no effect on dependencies.

Multiple Events

ic-trigger-on supports multiple events, separated by a comma: click, change

Simple Example

Here is a div with a header tag near the bottom that issues a request once it is scrolled into view:

  <h2>Scroll Down To Load <i class="fa fa-arrow-down" style="margin-bottom:150%"></i> </h2>

  <h2 ic-src="/get_it" ic-trigger-on="scrolled-into-view">
    Not Loaded Yet...
  </h2>

Scroll Down To Load

Not Loaded Yet...