javascript - Best practice to hide a svg element -
i have many (>100) svg-<g>
-elements on screen, , if user hovers on 1 of them, inner img-elements included in <g>
should become visible. if user hovers out of <g>
, should turn invisible again.
i see there 2 ways of doing this:
- insert
<img>
on every mouseenter , remove on mouseleave. - insert elements on every
<g>
during initial rendering, make them invisible , turn them visible on mouseenter.
which 1 way go? if #2, whats css property use? found many, including
visibility : hidden;
and
display : none;
keep in mind doesn't work in same way,
visibility: hidden;
conserve space object using, if object size example: width: 250px, height:200px, show blank space.
by other hand:
display:none;
won't show blank space, object still there @ width:0px height:0px
bye!
Comments
Post a Comment