--- id: 587d7faa367417b2b2512bd4 title: Adicionar um efeito de hover a um elemento D3 challengeType: 6 forumTopicId: 301469 dashedName: add-a-hover-effect-to-a-d3-element --- # --description-- É possível adicionar efeitos que destacam uma barra quando o usuário passa o mouse sobre ela. Até agora, o estilo para os retângulos é aplicado com os métodos incorporados do D3 e SVG, mas você também pode usar CSS. Você definiu a classe CSS no elemento SVG com o método `attr()`. Então, a pseudoclasse `:hover` para a sua nova classe contém as regras do estilo para quaisquer efeitos de hover. # --instructions-- Use o método `attr()` para adicionar uma classe de `bar` a todos os elementos `rect`. Isso altera a cor da barra para marrom quando você passar o mouse por cima dela. # --hints-- Seus elementos `rect` devem ter uma classe `bar`. ```js assert($('rect').attr('class').trim().split(/\s+/g).includes('bar')); ``` # --seed-- ## --seed-contents-- ```html ``` # --solutions-- ```html ```