-
winnrcs2Asked on August 15, 2018 at 5:15 PM
Hi - I was wondering if it was possible to hover an IMG or PDF when hovering over specified text within one of the Forms? Thank you!
-
Jed_CReplied on August 15, 2018 at 8:40 PM
Do you mean to say to prompt a message box when hovering on an image or PDF, correct? If so, you can go to the field properties and under "Advanced" tab, add the text you want inside the "Hover text" box.
I hope this helps. Let us know if you have any questions or if you need further assistance.
-
winnrcs2Replied on August 16, 2018 at 11:43 AMHi! No, I would like to hover over text and have an image pop up. Is that
possible?
Thanks,
Anne
... -
Victoria_KReplied on August 16, 2018 at 1:17 PM
Hello Anne,
Do you mean to display an image when form element is hovered?
Test form: https://form.jotform.com/82274791133963
This can be achieved by adding custom css code to your form. I have used this one:
#text_3:hover:after {
content: url(https://cdn.jotfor.ms/assets/img/logo/logo-new@4x.png);
display: block;
z-index: 1000;
position: relative;
width: 670px;
left: 600px;
top: -150px;
zoom: 0.3;
border: 4px solid #ccc;
border-radius: 6px;
background-color: #f5f5f5;
box-shadow: 0px 2px 4px #666;
padding: 5px;
}
Related guide: How-to-Inject-Custom-CSS-Codes
Please let us know if you need any further assistance.
-
winnrcs2Replied on August 16, 2018 at 3:43 PMThank you... Yes, this puts me on the correct path.
I have added that code (and replaced the URL) on my Form
https://www.jotform.com/build/82266874449168
But my question is about this portion of the coding: *#text_3:hover:after
{ *I believe that is indicating where to hover.
... -
Victoria_KReplied on August 16, 2018 at 4:15 PM
You're correct. The selector must be different. I have adjusted the code under your form and fixed a link to the file (there should be placed direct image url).
It now works like below. Hope this helps!
-
winnrcs2Replied on August 16, 2018 at 6:43 PMYes! Thank you, just like your video shows. The only problem is that when
I load the survey ( https://form.jotform.com/82266874449168), I don't see
the Bio jpg pop up. I just have a narrow gray box pop up. Hmm...
... -
Jed_CReplied on August 16, 2018 at 7:52 PM
Below is an invalid URL for an image link.
That is the URL you've added in your CSS code. It is not working before it's not a valid link. Please make sure to get the actual URL link of an image.
Let us know if you have any questions or if you need further assistance.