--- id: 587d7faa367417b2b2512bd4 title: Añade un efecto "Hover" a un elemento D3 challengeType: 6 forumTopicId: 301469 dashedName: add-a-hover-effect-to-a-d3-element --- # --description-- Es posible añadir efectos que resalten una barra cuando el usuario pasa mouse sobre ella. Hasta ahora, el estilo de los rectángulos se aplica con los métodos incorporados en D3 y SVG, pero también puedes usar CSS. Tú estableces la clase CSS en los elementos SVG con el método `attr()`. Después la pseudo-clase `:hover` para tu nueva clase mantiene las reglas de estilo para cualquier efecto hover. # --instructions-- Utiliza el método `attr()` para añadir una clase de `bar` a todos los elementos `rect`. Esto cambia el color de (relleno) `fill` de la barra a marrón cuando pases el mouse sobre ella. # --hints-- Tu elemento `rect` debe tener una clase de `bar`. ```js assert($('rect').attr('class').trim().split(/\s+/g).includes('bar')); ``` # --seed-- ## --seed-contents-- ```html ``` # --solutions-- ```html ```