Search code examples
jqueryjquery-selectorsadobe-analytics

Adobe DTM - Get ID value from div that enters viewport (event based rule)

How do I capture the value of the ID attribute of a div, from a specific class, that enters the viewport in "visible" state? When I create a "enters viewport" rule, it fires for all the divs in the source code, (given that they are within the viewport) visible or not.

I can't seem to write the condition to only fire the rule when the div is visible, or how to get the attribute ID.

Solution

  • Use an Event Based Rule:

    • Event Type: enters viewport
    • Element Tag or selector: div.specialClass //specialClass is the class you search for
    • Rule Condition, Custom: if (jQuery("div.specialClass:visible")[0] != undefined){return true;}

    Thats it, the rule will fire if the element with the specialClass will enter the viewport and is visible.

    To track the ID, just use a Data Element with a CSS Selector and in this Event Based Rule reference to this Data Element.