firefox使用svg:clipPath& NS_ERROR_FAILURE

时间:2018-01-07 05:21:15

标签: javascript css firefox svg

我一直试图用getBBox()获取svg:clipPath元素的高度和宽度。它似乎在firefox中不起作用,除非正确呈现svg元素显示。我还尝试将可见性设置为隐藏各种svg元素。不幸的是,没有运气。我想知道更改DOM元素在firefox中不会抛出NS_ERROR_FAILURE的显示。

//doesn't work with firefox
//console.log(document.getElementById("clipPathBounds").getBBox());
.clip-svg {
  position: absolute;  
  clip-path: url(#svgPath);
  height: 600px;
  width:600px;
}
 <svg>
    <defs>
       <clipPath id="svgPath">
          <use id="clipPathBounds"  xlink:href="#spath" overflow="hidden" />  
           </clipPath>       
             <path id="spath" d="m 154.99433,0 -25.06359,46.7528 c -2.844,5.08126 -7.93959,4.60996 -13.03517,1.77192 l -18.14538,-9.39723 13.52402,71.81132 c 2.844,13.11953 -6.28082,13.11953 -10.78395,7.44687 L 69.82305,82.93015 64.68194,100.93531 c -0.59287,2.36446 -3.19957,4.84789 -7.11025,4.25649 l -40.04353,-8.42033 10.51769,38.24325 c 2.25156,8.50956 4.00782,12.03281 -2.27304,14.27716 L 11.5,156.00092 80.43236,211.99997 c 2.72839,2.11737 4.10687,5.92775 3.13555,9.37778 l -6.03305,19.8011 c 23.73443,-2.73623 45.00085,-6.85284 68.74731,-9.38813 2.09632,-0.22382 5.60582,3.23618 5.59142,5.66585 L 148.72882,310 l 11.5398,0 -1.81651,-72.38785 c -0.0145,-2.42967 3.16938,-6.04525 5.26571,-5.82143 23.74645,2.5353 45.0129,6.6519 68.74732,9.38813 l -6.03303,-19.8011 c -0.97132,-3.45003 0.40715,-7.26041 3.13554,-9.37778 L 298.5,156.00092 284.2272,149.29188 c -6.28088,-2.24435 -4.52461,-5.7676 -2.27305,-14.27716 l 10.51772,-38.24325 -40.04357,8.42033 c -3.91067,0.5914 -6.51737,-1.89203 -7.11026,-4.25649 l -5.1411,-18.00516 -31.6672,35.45553 c -4.50314,5.67266 -13.62798,5.67266 -10.78397,-7.44687 l 13.524,-71.81132 -18.14534,9.39723 c -5.09571,2.83804 -10.19117,3.30934 -13.03518,-1.77192"/>                      
          </defs>                
            </svg>
            
            
 <div class="clip-svg"></div>

0 个答案:

没有答案