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

[d-murillotti-tamu-edu]

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!!

[RavanH]

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

[Author]

Posts