Re: Mouseover text color change is not working in IE & FF

"Brian Birtles [email protected] [svg-developers]" <[email protected]> Mon, 6 Jul 2015 08:36:26 +0900
Newsgroups gmane.text.xml.svg.devel
Message-ID <[email protected]>
On 2015/06/24 5:45, [email protected] [svg-developers] wrote:
> I'm experiencing a strange issue with mouseover in svg graphics where a
> mouseover on text is not changing the color in IE and Firefox but it is
> working fine with Chrome.


It works for me in Firefox. What is the problem you're seeing?


It won't work in IE, however, because IE does not support SVG's 
animation elements.


> Here is the sample code
>
>
> <html encoding="UTF-8" >
> <body>
>    <svg xmlns="http://www.w3.org/2000/svg" version="1.1"
> xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"
> id="root" width="500pt" height="375pt" viewBox="0 0 20000 15000">
>      <set id="web_show" attributeName="visibility" attributeType="CSS"
> begin="2s" to="visible"/>
>      <rect x="0" y="0" width="20000" height="15000" style="fill:#000000;
> " />
>      <text id="_Text_Box" x="7400" y="1820" width="2200" fill="#ffffff"
> stroke="none" style="font-weight:400px; font-size:320px;
> font-family:Verdana; baseline-shift:-100%;">Text </text>
>      <g id="_Text_Box_mouseovers" >
>          <animate xlink:href="#_Text_Box" attributeName="fill"
> values="#ffffff;#ff0000" dur="0s" fill="freeze"
> begin="_Text_Box.mouseover" />
>          <animate xlink:href="#_Text_Box"
> attributeName="text-decoration" values="none;underline" dur="0s"
> fill="freeze" begin="_Text_Box.mouseover" />
>          <animate xlink:href="#_Text_Box" attributeName="fill"
> values="#ff0000;#ffffff" dur="0s" fill="freeze"
> begin="_Text_Box.mouseout" />
>          <animate xlink:href="#_Text_Box"
> attributeName="text-decoration" values="underline;none" dur="0s"
> fill="freeze" begin="_Text_Box.mouseout" />
>      </g>
>    </svg>
> </body>
> </html>
>
> 




------------------------------------
Posted by: Brian Birtles <[email protected]>
------------------------------------

-----
To unsubscribe send a message to: [email protected]
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my membership"
----