Pop up window | XM Community
Question

Pop up window

  • 7 September 2019
  • 3 replies
  • 167 views

Userlevel 1
Hi, I want to do the following, and wondered if any one has thoughts on it?

1. A button that allows me to click on
2. A pop up with a graphic when I click on it
I solved 1, 2, but not the problems are

1. It briefly shows the graphic before I click the button. (Not supposed to see it before I click on the button)
2. I need data on 1) when people click on this button 2) when people close this popup. 3) when people leave this page... how can I do that?

Thanks a lot!!

3 replies

Userlevel 7
Badge +11
So just to recap, you've got a button that creates a pop-up when you press it? You have three questions:
1. How to stop the pop-up from being shown before the button is pressed
2. How to track when the pop-up is closed
3. How to track how long a person stays on the page

Assuming you are using this within a Qualtrics survey, you can use a timing question to solve your third question.

For your first question, I don't know the answer but you'll want to post your code for the coders to help you.
Userlevel 1
Hi Jen,

Thanks for the response. This is the code I have:

Qualtrics.SurveyEngine.addOnReady(function()
{jQuery("[id*='dialog']" ).dialog({ autoOpen: false});
// jQuery('body').on('click','.ui-widget-overlay',function(){ jQuery("[id*='dialog']").dialog('close'); });

jQuery( "#btn1" ).click(function() {
jQuery("#dialog").dialog( "option", "modal", true );
jQuery("#dialog").dialog( "open" );});

I want to track
1. When do people click on this button (btn1)
2. When do please close the popup.
3. And also control where to display this pop up - want it at a specific location.

_____
Lastly,
I also want to know how to set specific location for this auto popup code - I want it to be displayed at the specific location of the page..

Qualtrics.SurveyEngine.addOnReady(function()
{ jQuery("[id*='dialog']" ).dialog({ autoOpen: false});
var delayTime = 3000; //This is the time of delay
setTimeout(function(){jQuery("[id*='dialog']" ).dialog({ autoOpen: true})}, delayTime);
});


Thanks a lot!!!!
Hi @Qualtricshelp can you maybe explain to me how you made that button and image pop-up? I need the exact same thing, but I'm new to Qualtrics, javascript and html, and I do not know where to properly save my images such that it works.

Leave a Reply