Permalink
Browse files

Add new example for mouseover/mouseout

  • Loading branch information...
1 parent cbb1d92 commit 49b53f5f3970079c91d14af18de4b7a20d686075 @davidaurelio davidaurelio committed Dec 12, 2012
@@ -0,0 +1,32 @@
+function animate(element, property, from) {
+ if (!element || element === stage.root) return;
+ var anim = {};
+ anim[property] = element.initialValues[property];
+ element
+ .attr(property, from)
+ .animate('.5s', anim);
+}
+
+tools.forEach(Array(4), function(_, i) {
+ var initialFill = 'hsl(' + 90 * i + ', 100%, 50%)';
+ var initialStroke = 'black'
+ var rect = new Rect((i % 2) * 101, i > 1 ? 121 : 20, 100, 100)
+ .fill(initialFill)
+ .attr({
+ strokeWidth: 2,
+ strokeColor: initialStroke
+ })
+ .on('mouseover', function(event) {
+ animate(this, 'fillColor', 'white');
+ animate(event.relatedTarget, 'fillColor', 'black');
+ })
+ .on('mouseout', function(event) {
+ animate(this, 'strokeColor', 'red');
+ animate(event.relatedTarget, 'strokeColor', 'yellow');
+ })
+ .addTo(stage);
+ rect.initialValues = {
+ fillColor: initialFill,
+ strokeColor: initialStroke
+ };
+});
@@ -73,6 +73,7 @@ movieList = {
'event-multi-touch.js',
'event-multi-touch2.js',
'event-mouse-button.js',
+ 'event-mouse-over-out.js',
'key-events.js'
],
'Filter': [
@@ -73,6 +73,7 @@
"event-multi-touch.js",
"event-multi-touch2.js",
"event-mouse-button.js",
+ "event-mouse-over-out.js",
"key-events.js"
],
"Filter": [

0 comments on commit 49b53f5

Please sign in to comment.