Home :: Tutorials :: SVG :: Events

Click Event

<rect x="5" y="5" width="40" height="40" fill="red">
    <set attributeName="fill" to="blue" begin="click"/>
</rect>

Mousedown Event

<rect x="5" y="5" width="40" height="40" fill="red">
    <set attributeName="fill" to="blue" begin="mousedown"/>
</rect>

Mouseup Event

<rect x="5" y="5" width="40" height="40" fill="red">
    <set attributeName="fill" to="blue" begin="mouseup"/>
</rect>

Mouseover Event

<rect x="5" y="5" width="40" height="40" fill="red">
    <set attributeName="fill" to="blue" begin="mouseover"/>
</rect>

Mouseout Event

<rect x="5" y="5" width="40" height="40" fill="red">
    <set attributeName="fill" to="blue" begin="mouseout"/>
</rect>

Mousemove Event

<rect x="5" y="5" width="40" height="40" fill="red">
    <set attributeName="fill" to="blue" begin="mousemove"/>
</rect>