All Questions
60
questions with no upvoted or accepted answers
3
votes
0
answers
370
views
Adding shadow to SVG on hover
I've been trying to add a shadow to an svg path when it is hovered. Here is a fiddle showing my attempt: https://jsfiddle.net/do6fk291/
I've tried adding filter: url(#blur-filter) on hover which sort ...
- 4,141
2
votes
0
answers
95
views
Starting a SVG animation with keyframes using "begin" property
I'm actually learning SVG in order to import a vector animation I did in Flash inside a website, then integrate some "interactivity" (with the SVG property begin="mouseover").
So first, here is a ...
- 39
1
vote
0
answers
79
views
SVG popup doesn't cover background text
When I hover over a graph or point on a graph, a modal window appears, but this window does not overlap the text below it and it overlaps one another
Code of SVG popup
<g class="highcharts-...
- 7
1
vote
0
answers
760
views
Styled Components: Hover works on react-icons but not custom svg icons
I am trying to create a hover effect on a svg icon using Styled Components. I get the result I want when using a svg from the react-icons library, however the hover does not work for custom svgs that ...
- 29
1
vote
0
answers
207
views
SVG custom tooltip on hover following mouse movement
I'm tinkering here on JSFiddle. The issue faced is that onmouseleave the 3rd rect has the inscription left if any of the other rect are hovered. Can someone fix this? So that onmouseleave the tooltip ...
1
vote
2
answers
303
views
SVG on hover not taking Transition
I am trying to animate a SVG where I need to change path of the svg. While I am hovering svg at that time path changes but the Transition on hover not working. I need to make a smooth transition on ...
- 228
1
vote
0
answers
59
views
One SVG class hover can affect another SVG element
On this page, I have chemical table in SVG code and the chemical elements are in rect tag. The names of the elements within the rect tag are in text tag.
I require that when a mouse is over the text ...
1
vote
0
answers
170
views
svg hover overlapping elements in Firefox
I have a svg with some circles that should get bigger on hover, here is a snippet
!This will not work in Firefox
var svgRoot = $('.svg-root')[0];
$('.bubble').mouseover(function (e) {
...
1
vote
1
answer
600
views
CSS active selector (animation)
can someone look at this css code please. "hover" function working fine, but "active" not. When I click on the Logo nothing happend. What is wrong in this code?
.splash-logo {
background: ...
- 77
1
vote
2
answers
667
views
Onmouseover hover effect in SVG when hosted on Sharepoint
Could You help me that:
I have svg file:
FILE_SVG
exported from Illustrator. Designated target for me is to add "hover" effect to it (it could be Zomm effect or color changing), but at the end file ...
- 11
1
vote
1
answer
474
views
CSS background hover transition not sync with svg hover transition in IE
I am using svg icon for the location button.
I have apply hover transition on the button.
It works well in Chrome, Firefox, Safari except IE.
The hover effect in svg icon seems separated from the ...
- 343
1
vote
0
answers
109
views
CSS SVG filter issue: Hover effects work perfectly on localhost, but not on remote hosting/server
Hope anyone can help me resolving this problem...
So I have this peace of header in my index.html:
<META HTTP-EQUIV="Content-type" CONTENT="application/xhtml+xml; UTF-8">
And I have this ...
- 11
1
vote
0
answers
625
views
SVG mouseover and hover bug in Firefox?
.dot {
stroke:none;
fill: red;
}
.dot:hover {
fill: yellow;
}
<svg preserveAspectRatio="xMidYMin" width="100%" height="100%" viewBox="-1 -1 2 2">
<g transform="translate(0,0) scale(1)"...
- 4,633
1
vote
1
answer
233
views
"textLength" changes on hover for svg text elements in Internet Explorer
I'm using svg-text-elements for a Website Layout and i'm changing the textLength-attribute to get alle the Menu items in a Menu to have the same length. (When you change textLength the spacing is ...
1
vote
0
answers
808
views
svg hover working in ff and chrome no go in IE 9 10 11
[edit] I apologize this is my first time asking for assistance here. The code didn't paste properly initially so here is the link to the jsfiddle I created which was requested in the comments, https://...
- 11