svg鼠标响应事件的四种方法(其中两种可支持火狐)

 svg鼠标响应事件的四种方法

鼠标响应事件的四种方法,以click事件为例。

Mouse Events - SMIL


    "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
     xmlns:xlink="http://www.w3.org/1999/xlink">
    
        
    

实例演示: http://www.kevlindev.com/tutorials/basics/events/mouse/svg_smil/click.svg

Mouse Events - Attributes


    "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" [
                   xmlns:a3 CDATA #IMPLIED
              a3:scriptImplementation CDATA #IMPLIED>
                   a3:scriptImplementation CDATA #IMPLIED>
]>
     xmlns:xlink="http://www.w3.org/1999/xlink"
     xmlns:a3="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
     a3:scriptImplementation="Adobe">
    
               οnclick="changeColor(evt)"/>


实例演示:

http://www.kevlindev.com/tutorials/basics/events/mouse/svg_js/onclick.svg

Mouse Events - JavaScript+SMIL


    "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" [
                   xmlns:a3 CDATA #IMPLIED
              a3:scriptImplementation CDATA #IMPLIED>
                   a3:scriptImplementation CDATA #IMPLIED>
]>
     xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     xmlns:a3="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
     a3:scriptImplementation="Adobe">
    

实例演示: http://www.kevlindev.com/tutorials/basics/events/mouse/js_dom_smil/click_js_smil.svg

Mouse Events - EventListener


    "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" [
                   xmlns:a3 CDATA #IMPLIED
              a3:scriptImplementation CDATA #IMPLIED>
                   a3:scriptImplementation CDATA #IMPLIED>
]>
     xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     xmlns:a3="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
     a3:scriptImplementation="Adobe">
    

实例演示: http://www.kevlindev.com/tutorials/basics/events/mouse/js_dom/click_js.svg

转载于:https://www.cnblogs.com/dongzhiquan/archive/2009/10/10/1994728.html

你可能感兴趣的:(javascript)