***HELP***when SVG is clicked it should open Fancybox but doesn't

Home Forums Easy FancyBox Pro ***HELP***when SVG is clicked it should open Fancybox but doesn't

Tagged: 

This topic contains 1 reply, has 2 voices, and was last updated by  RavanH 2 weeks ago.

  • Author
    Posts
  • #11260

    Debbie Murillo
    Participant

    In short, I have a graphic that when a segment is clicked (id=”truck-node”) it should open a fancybox overlay that contains the div with the id=”fancy-truck”. I upgraded to Easy Fancybox-Pro in hopes that there would be a setting that I could find that would allow this to work.
    My code in the the svg is:

    <a id="truck-node" xlink:href="#fancy-truck" class="fancy-inline">
      <g>
        <rect class="cls-2" x="1455" y="610.35" width="27.1" height="120" rx="10.36" ry="10.36"/>
      </g>
    </a>

    and the code for the hidden content is:


    Truck Parking
    Problem Description:
    Shortage of truck parking…
    How it Relates:
    Location and classification…
    More…

    I have to have this ready to demo on November 8th and I can not get this to work. Please help!!

  • #11261

    RavanH
    Keymaster

    Hello Debby, welcome on these forums 🙂

    Sorry to hear you are having trouble getting things to work on your site. Looking at your code, I might be able to give some useful tips to help you along but if it’s not enough, could you send us a link to your site to see it live? You can post it on this thread of use the contact form (with mention of this thread).

    What I notice about your code is twofold and all about this snippet: xlink:href="#fancy-truck" class="fancy-inline"

    First, the class needs to be fancybox-inline but it might be just a type-O…

    Then, the script needs a href attribute but your code uses xlink:href which is likely not recognized by the script. Could you either change that to a simple href or (if xlink:href is needed for another script) add a dedicated href attribute?

    Rolf

You must be logged in to reply to this topic.

Site by Pharéo | Hosted on The Permanently Moving Network