0

I am trying to fade a d3 chord in a chord diagram to display:none

It works if I use the css class:

#circle:hover path.fade {
opacity: .03;
-webkit-transition: all .25s ease-out;
-moz-transition: all .25s ease-out;
-ms-transition: all .25s ease-out;
-o-transition: all .25s ease-out;
transition: all .25s ease-out;
}

however, this does not work with display:none. Any suggestions?

EDIT:

Ah this is a duplicate - missed the original question. Thanks!

As3adTintin
  • 2,406
  • 12
  • 33
  • 59

1 Answers1

1

There's no animation for changing the display attribute. You can smoothly transition opacity, but there's no possibility of changing the display smoothly.

To circumvent this you can transition both opacity and height at the same time, but this would require first setting the height or using javascript to change the height.

Voreny
  • 765
  • 6
  • 13