Rollover images in form

  • Profile Image
    headshotphotographers
    Asked on January 14, 2013 at 12:40 AM

    I'd like to keep the embed code as simple and secure as possible. 

    form placements: headshotphotographers.com/partners/index4.html
    form: formID=30129370465956
    this is how it should work: http://headshotphotographers.com/retouching/

    Is this possble?
    I like to avoid putting a pop up link to a webpage.

    thanks! 

  • Profile Image
    Welvin
    Answered on January 14, 2013 at 03:59 AM

    Hi,

    Yes, that is possible. Sample Form: http://form.jotformpro.com/form/30113699372960?

    Just add the Free Text HTML field on the form, get the ID of the field and inject this codes:

    #text_3.form-html{

    background:url(

    "http://headshotphotographers.com/retouching/before_1.jpeg") no-repeat !important;

    border: none !important;

    height: 600px;

    width: 400px;

    }

    #text_3.form-html:hover {

    background:url(

    "http://headshotphotographers.com/retouching/after_1.jpeg") no-repeat !important;

    }

    Just repeat the same to all the fields, just replace the images and height of each of the images.

    Let us know if you need assistance implementing this. Thanks