Timeline for How to make an inset drop shadow in SVG
Current License: CC BY-SA 3.0
7 events
| when toggle format | what | by | license | comment | |
|---|---|---|---|---|---|
| Dec 26, 2013 at 16:38 | comment | added | Michael Mullany | That's the effect of the two feFuncA's I have in there. They chop up the alpha range into seven and three ranges respectively and set any opacity in those ranges to 0, 1, 1, 1, 1, 1, 1 and 0, 0, 1 respectively. If you want to set the fill opacity very low (like .03) you'll have to adjust those tableValues appropriately (0 followed by 49 1's for example). IE only supports 64 values in that array, so you can't do an opacity lower than 1/64th. | |
| Dec 26, 2013 at 3:56 | comment | added | Joeytje50 |
This works perfectly, thanks very much! I've got one question about your fiddle though, when I tried changing the fill-opacity of the <rect>, the inset shadow suddenly disappeared when the fill-opacity got below 17% or above 66% (it is interesting to be able to get the opacity as low as possible for the browsers that don't support filters, of course), while not changing at all when changing within that range. Is there any particular reason for that?
|
|
| Dec 26, 2013 at 3:45 | vote | accept | Joeytje50 | ||
| Dec 26, 2013 at 3:31 | history | edited | Michael Mullany | CC BY-SA 3.0 |
added 1592 characters in body
|
| Dec 26, 2013 at 3:26 | history | edited | Michael Mullany | CC BY-SA 3.0 |
added 1592 characters in body
|
| Dec 26, 2013 at 3:05 | history | edited | Michael Mullany | CC BY-SA 3.0 |
added 303 characters in body
|
| Dec 26, 2013 at 2:56 | history | answered | Michael Mullany | CC BY-SA 3.0 |