Raphaeljs Introduction to Mastery (ii)

In this section we will describe the attributes and events of elements in Raphaeljs, as well as the code expansion of the preceding article.

<! DOCTYPE html>
Adding attributes to an element in paper is using the Attr method, which can be added more than once or individually.
The attributes of the element have the following:
cursor (pointer color),Cx,cy (Park or ellipse center point coordinates),Fill (filled color),fill-opacity (filter),Font,font-family,Font-size,Font-weight,Height
href,OpacityPathSrcStrokeStroke-dasharray,Stroke-linecap,Stroke-linejoin,stroke-miterlimit,stroke-opacity,stroke-width   
TargetTextText-anchor,title,transform,width,x, y, etc.   
If you want to set the style of an element, you can use the Element.node property to get the tag that the current element resolves to after the browser, and then use jquery to set it up.
Element's event:
The RAPHAELJS element typically has the following events:
1.click Click event;
2.dbclick double click event;
3.drag events, element drag events;
3.hide hidden events;
4.hover suspension event;
5.MouseDown the mouse button
6.mouseout Mouse Out Event
7.mouseover, MouseUp send off the incident;
The way to dismiss an event is as follows:
1.unclick
2.undbclick
3.unmousedown
4. Wait for the word "un" to precede the words that bind the event.
Of course element events and attributes are also set through the element. Node.
Here we look at a specific case, when the mouse moved into the circle to change the color of the circle fill, when moving out of the original color back

<! DOCTYPE html>
As follows:





Raphaeljs Introduction to Mastery (ii)