Expand my Community achievements bar.

SOLVED

DTM - Fire Single Call when Element becomes Visible

Avatar

Level 2

I'm working with a site that's built a lot like an app--almost everything is on one html page. So I have to craft a page-to-page journey based either on what they click, or what shows up on the page. 

So is there a way to fire off a call when a certain element becomes visible? There are tons of elements that are hidden, and if I build an event-driven rule that waits for them to enter the viewport, they fire off even when they're hidden, which is no good to me.

thanks!

Craig

1 Accepted Solution

Avatar

Correct answer by
Level 3

Craig,

It's possible to do this using the CSS selector syntax in an event-based rule.  Set the event type to "element exists", and then use a selector like this:

div.hiddendiv[style*='display:block']

What this example does is looks for a div with a class of 'hiddendiv', and makes sure that the style includes "display:block".  You may have to tweak this approach depending on how your site developers are hiding/showing the elements, but something similar to this should accomplish what you need.

Hope this helps!

Best,
Shawn

View solution in original post

1 Reply

Avatar

Correct answer by
Level 3

Craig,

It's possible to do this using the CSS selector syntax in an event-based rule.  Set the event type to "element exists", and then use a selector like this:

div.hiddendiv[style*='display:block']

What this example does is looks for a div with a class of 'hiddendiv', and makes sure that the style includes "display:block".  You may have to tweak this approach depending on how your site developers are hiding/showing the elements, but something similar to this should accomplish what you need.

Hope this helps!

Best,
Shawn