SVG set fill

Discuss SVG code, accessible via the XML Editor.
cjarbo2
Posts: 1
Joined: Tue Apr 24, 2012 10:37 am

SVG set fill

Postby cjarbo2 » Tue Apr 24, 2012 11:07 am

I can not get around this. No matter what I do, I can not have the fill change on my svg. I have tried using <set> and <animate> and neither does anything. However, when I change to set or animate fill-opacity, everything works fine. What am I doing wrong? Is the file just totally unusable for this?

Below is the section of the code that I have edited.

<g id="english">
<animate attributeType="CSS"

attributeName="fill" from="black" to="red"

begin="tEnglish.mouseover" dur="1s"

fill="freeze" />
<animate attributeType="CSS"

attributeName="fill" from="red" to="black"

begin="tEnglish.mouseout" dur="1s" fill="freeze"

/>
<path id="gy" fill="black"

stroke="#FFFFFF" stroke-width="0.5"

d="M380.146,251.012c0.226-0.444,0.605-0.66,0.54

-1.346
c-0.044-0.463,0.167-0.603,0.447

-0.756c0.063-0.035,0.225-0.314,0.438-

0.173c0.271,0.181,0.255-0.015,0.49-0.179
c0.207-0.144,0.609-0.246,0.717-

0.446c0.094-0.175-0.053-0.438-0.277-0.358c-

0.561,0.199-0.262-0.371-0.498-0.68
c-0.215-0.281,0.054-0.604,0.233

-0.826c0.226-0.279,0.18-0.264,0.503-0.429c0.435

-0.222,0.672-0.663,1.067-0.854
c0.537-0.26,0.107-0.456-0.137-

0.896c0.364,0.427,0.897,0.708,1.318,1.071c-

0.203-0.311-0.623-0.385-0.781-0.736


c0.516,0.233,1.056,0.572,1.438,0.996c0.309,0.341

,0.699,1.002,1.081,1.225c0.426,0.248,0.536,1.047

,0.385,1.467
c-0.112,0.314-0.275,0.529-

0.315,0.876c-0.034,0.3-0.042,0.626-

0.22,0.884c0.591-0.108,0.145-1.553,1.055-1.229


c0.684,0.243,1.522,0.729,1.689,1.519c0.444-

0.4,0.76,0.428,0.822,0.746c0.108,0.554-

0.104,1.391-0.463,1.822
c0.598,0.168,0.085,0.596-

0.051,0.759c-0.131,0.156-1.692-0.335-

1.604,0.69c0.054,0.624,0.046,1.03-0.051,1.643
c-

0.065,0.412,0.305,1.228,0.605,1.506c0.308,0.285,

0.103,0.627,0.563,0.692c0.096,0.014,0.347-

0.106,0.405-0.014


c0.189,0.298,0.214,0.666,0.267,1.005c0.098,0.631

,0.754,1.145,0.754,1.766c0,0.631,0.714,0.611,0.9

39,0.994
c-0.764,0.488-1.506-0.496-

2.236,0.104c-0.123,0.101-0.195,0.237-

0.305,0.348c-0.201,0.205-0.456,0.116-0.7,0.201
c-0.446,0.155-0.467,0.378-

0.994,0.384c-0.163,0.003-0.257,0.131-

0.363,0.234c-0.08,0.014-0.155,0.044-0.223,0.09


c0.02,0.093,0.031,0.186,0.036,0.281c-

0.116,0.232-0.762,0.336-0.997,0.255c-0.164-

0.056-0.059-0.245-0.291-0.247
c-0.185-0.002-0.556-0.141-0.626

-0.33c-0.112-0.307-0.553-0.783-0.892-0.83c0.031

-0.073,0.061-0.148,0.09-0.223
c-0.313,0.02-0.276-0.261-0.238-

0.475c0.065-0.373-0.031-0.517-0.257-0.788c-

0.372-0.45-0.354-1.307-0.239-1.839
c0.089-0.412,0.394-0.789,0.396-

1.223c0.001-0.375,0.105-0.348,0.323-0.664c0.136

-0.198,0.426-0.547,0.298-0.783
c-0.103-0.189-0.372-0.454-0.372

-0.68c0-0.218,0.115-0.426-0.136-0.535c-0.174-

0.075-0.615-0.082-0.722-0.262
c-0.101-0.168,0.249-0.673,0.284

-0.868c0.057-0.325,0.015-0.702-0.244-0.936c-

0.387-0.349-1.021,0.2-1.49-0.031


C381.053,252.659,380.398,251.559,380.146,251.012

"/>
</g>

I tried also
<set attributeType="CSS"
attributeName="fill" from="black" to="red"
begin="tEnglish.mouseover" end="tEnglish.mouseout"
/>

But nothing seems to work. Is this just not something you can do in SVG with a Path object? I am totally vexed.

Thank you all in advance for your help.

chriswww
Posts: 383
Joined: Fri Nov 19, 2010 3:04 pm

Re: SVG set fill

Postby chriswww » Tue Jul 17, 2012 9:31 am

css support for svg is pretty patchy....nevertheless i think your issue is that you might be confusing svg/css/dom attribute names and allowable values...or is that me getting confused?


Return to “SVG / XML Code”