Replacing the JotForm lightbox link with a rollover button

  • Profile Image
    tizbo1423
    Asked on April 16, 2013 at 04:34 PM

    I have gotten as far as having the lightbox open from a button image, but I can't seem to get it work as a rollover button.

    Here is the HTML I am using after the script code:

    <a class="lightbox-31054933063145" style="cursor:pointer;"><img src="../images/bt-inquire-1.jpg" onmouseover="../images/bt-inquire-2.jpg" onmouseout="../images/bt-inquire-1.jpg"/></a>

    Is there something I'm missing?

    Also, is there any way to change the font of the Window Title of the lightbox form?

     

    Thanks!

     

  • Profile Image
    jonathan
    Answered on April 16, 2013 at 05:40 PM

    Hi,

    Please try double check first if you got the 2nd image correct path/URL.. it seems to be missing. Perhaps that should fix it already. 

     

    As for the form title please review the suggestion offered by our colleague NeilVicente on this thread. It is similar to what you need.

    Hope this help. Please inform us if you need further assistance.

    Thanks.

  • Profile Image
    tizbo1423
    Answered on April 17, 2013 at 10:56 AM

    I checked on the image, it was missing and so I got it in there - but still no luck on having the roll over effect.

  • Profile Image
    jonathan
    Answered on April 17, 2013 at 11:06 AM

    Hi,

    But it seems the 2nd image still does not have its correct path..

    This is for the 1st image http://sohocontemporaryart.com/images/bt-inquire-1.jpg

    I could not get it for the 2nd image.

    Because there is no link

     

    Please check again. Post the link to 2nd image here if possible so we can test.

    Thanks.

  • Profile Image
    tizbo1423
    Answered on April 17, 2013 at 11:08 AM

    Here's the link to the image.

    http://www.sohocontemporaryart.com/images/bt-inquire-2.jpg

  • Profile Image
    sidharth_kch
    Answered on April 17, 2013 at 12:45 PM

    @tizbo1423

    Can you please replace your code with this one and see if that helps you:

    <script language="javascript" type="text/javascript">  

           function mouseOverImage() {

               document.getElementById("imgPL").src = "http://www.sohocontemporaryart.com/images/bt-inquire-2.jpg";

           }

     

           function mouseOutImage() {

               document.getElementById("imgPL").src = "http://www.sohocontemporaryart.com/images/bt-inquire-1.jpg";

           } 

     

        </script>  

        <a class="lightbox-31054933063145" style="cursor:pointer;"><img id="imgPL" src="//www.sohocontemporaryart.com/images/bt-inquire-1.jpg" onmouseover="mouseOverImage();" onmouseout="mouseOutImage();"/></a>

     

    Thanks,

    Sidharth

  • Profile Image
    tizbo1423
    Answered on April 17, 2013 at 12:49 PM

    Perfect, thank you very much!

  • Profile Image
    sidharth_kch
    Answered on April 17, 2013 at 12:54 PM

    @tizbo1423

    You are welcome.

    Should you have any questions please feel free to contact us.

    Thanks,

    Sidharth