Hi There,
I am programming a survey with the hot spot function for respondents to select an area of an image as their answer. Has anyone had any experience with developing hover text that shows when a respondent puts their mouse over a box to give a definition/content?
If there are any examples/tips that could be shared this would be greatly appreciated.
Thanks in advance!
If you need any further information from my end please let me know.
Page 1 / 1
Hi there, if you still need, I was able to put something like this by adding a
- 2 Regions (5,6)
- 3 Regions (6,7,8)
- 4 Regions (7,8,9,10)
To give it a try, first create a Hot Spot question that is set to Dislike/Like and add 3 regions to it. Next, add the below to the question's JavaScript in the OnReady section:
var qid = this.questionId;
var region1 = '#'+qid+'> div.Inner.BorderColor.LikeDislike > div > fieldset > div > div > div > svg > path:nth-child(6)';
var title1 = document.createElementNS('http://www.w3.org/2000/svg', 'title');
title1.textContent = "Hover Text 1";
var region2 = '#'+qid+'> div.Inner.BorderColor.LikeDislike > div > fieldset > div > div > div > svg > path:nth-child(7)';
var title2 = document.createElementNS('http://www.w3.org/2000/svg', 'title');
title2.textContent = "Hover Text 2";
var region3 = '#'+qid+'> div.Inner.BorderColor.LikeDislike > div > fieldset > div > div > div > svg > path:nth-child(8)';
var title3 = document.createElementNS('http://www.w3.org/2000/svg', 'title');
title3.textContent = "Hover Text 3";
setTimeout(function(){
jQuery(title1).appendTo(region1);
jQuery(title2).appendTo(region2);
jQuery(title3).appendTo(region3);
},1000);
Leave a Reply
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.