How would I add a lightbox form to an image map?

  • Profile Image
    darthschrader
    Asked on May 22, 2012 at 01:39 PM

    So here's the code for the image...

    <img src="//rontheitguy.com/wp-content/uploads/Website-Pricing.png" alt="" width="605" height="463" border="0" usemap="#Map" class="aligncenter size-full wp-image-1118" title="Website Pricing" />

    <map name="Map" id="Map">

    <area shape="rect" coords="40,376,174,414" target="_blank" href="Graphics" />

    <area shape="rect" coords="234,385,369,423" target="_blank" href="Web" />

    <area shape="rect" coords="433,376,566,414" target="_blank" href="Consulting" />

    </map>

    I know how to ad the link where the red text is, but can the lightbox code be placed there? I can't seem to get it to work.

  • Profile Image
    idarktech
    Answered on May 22, 2012 at 11:08 PM

    Hi,

    Is this what you are looking for? I have already added your forms so that it'll be ready for embedding :)

    Here, just copy the page source to find it out. http://idarktech.com/test/test_lightbox_map.html

    Let us know if you need further assistance with this. Thanks!

  • Profile Image
    darthschrader
    Answered on May 22, 2012 at 11:19 PM

    Perfect!...And yet, this looks like something I should have been able to figure out!  Thanks once again for the help!

  • Profile Image
    idarktech
    Answered on May 22, 2012 at 11:24 PM

    Your welcome!

    Should you have any other questions, contact us again here. Thanks!

  • Profile Image
    idarktech
    Answered on May 22, 2012 at 11:36 PM

    @darthschrader,

    Hi,

    Let me please inform you that my first code doesn't seem to work on Firefox browser. I have now updated my codes, kindly check the page again or you can copy the full source code here: http://pastebin.com/raw.php?i=R4xiCfLq

    Thanks!

  • Profile Image
    darthschrader
    Answered on May 23, 2012 at 12:51 AM

    Got it! Thanks so much!