title: how to make svg object clickable link?
body: <p>i want to scroll to html id tag using  img/1.png   image in svg file </p>
  
  <p>my Html Block</p>
  
  <pre><code>&lt;object width="1024" height="597" data="svg/index/1.svg" type="image/svg+xml" id="pdf1" style="width:1024px; height:597px; background-color:white; -moz-transform:scale(1); z-index: 0;"&gt;
  &lt;/object&gt;
  </code></pre>
  
  <p>my Svg file  1.svg</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="UTF-8" standalone="no"?&gt;
  &lt;!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"&gt;
  &lt;svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"&gt;
       &lt;defs&gt;
            &lt;style type="text/css"&gt;&lt;![CDATA[
               .g1_1{
                    fill: #8FEFCA;
                    fill-opacity: 0.71000695;
               }
               .g2_1{
                    fill: #8EDBED;
                    fill-opacity: 0.5399929;
               }
            ]]&gt;&lt;/style&gt;
       &lt;/defs&gt;
       &lt;path d="M1024,597L0,597L0,320l1024,0l0,277Z" class="g1_1" /&gt;
       &lt;path d="M455,597l569,0L1024,0l-9,0Z" class="g2_1" /&gt;
       &lt;a xlink:href="#p2"&gt;
             &lt;image x="690" y="290" width="25" height="24" xlink:href="img/1.png" /&gt;
       &lt;/a&gt;
  &lt;/svg&gt;
  </code></pre>
  
  <p>i tried to use jquery inside svg file but jquery scroll function which i declared in html file is not called</p>
  
  <pre><code>&lt;div id = "p2"&gt; scroll here &lt;/div&gt;
  </code></pre>
  
  <blockquote>
    <p>Test URL : <a href="http://cabitsystems.com/svgtest/tt.html" rel="nofollow">http://cabitsystems.com/svgtest/tt.html</a></p>
  </blockquote>