{"id":32,"date":"2006-06-02T23:00:12","date_gmt":"2006-06-02T22:00:12","guid":{"rendered":"http:\/\/www.matthijskamstra.nl\/blog\/?p=32"},"modified":"2006-09-21T16:37:24","modified_gmt":"2006-09-21T15:37:24","slug":"two-buttons-interfering-with-each-others-rollover-rollout","status":"publish","type":"post","link":"https:\/\/www.matthijskamstra.nl\/blog\/2006\/06\/02\/two-buttons-interfering-with-each-others-rollover-rollout\/","title":{"rendered":"Two buttons interfering with each other’s rollover \/ rollout"},"content":{"rendered":"

This is a problem which is kinda difficult to describe in short sentence. But this is a problem which I seem to be running into for a couple of weeks now.<\/p>\n

Lets descibe the problem and I will illustrate with a banner (or a simple flv-player<\/a>) example:
\nThe banner (rectangle) is contains a short animation (20 kB) and when you rollover<\/em> the banner a video (flv) starts to load and play. Onrollout<\/em> the video will stop playing and hide. But the banner has also smaller pause \/ play and sound-off buttons on top of the bigger button which start \/ stop \/ etc the video.<\/p>\n

So the big button starts playing \/ loading the video onrollover<\/em> and onrollout<\/em> stops playing \/ hides the video. The smaller buttons are stop \/ pause \/ play \/ sound-on \/ sound-off actions.
\nNot so difficult, but the tricky part is in the rollout<\/em> of the big button: as soon as you rollover<\/em> the smal buttons it means that the video stops playing and hides (rollout<\/em> of the big button)….<\/p>\n

With a little<\/strike> help of Nils<\/a> we<\/strike> he cracked this nutt:<\/p>\n

View the working example here<\/a\nand the actionscript:\n\nupdate #1:<\/strong> onMouseMove<\/code> has to change to this.onMouseMove<\/code><\/p>\n

\r\nthis.big_btn.onRollOver = function() {\r\n\tthis.onMouseMove = function () {\r\n\t\tif (this.hitTest(_root._xmouse, _root._ymouse, true)) {\r\n\t\t\t\/\/ rollover state and action\r\n\t\t\tthis._alpha = 50;\r\n\t\t\t_root.MyCustomRoll(\"rollover: big_btn\");\r\n\t\t} else {\r\n\t\t\t\/\/ rollout state and action\r\n\t\t\tthis._alpha = 90;\r\n\t\t\t_root.MyCustomRoll(\"rollout: big_btn\");\r\n\t\t\tdelete this.onMouseMove;\r\n\t\t\t\/\/ trace(\"no hit\");\r\n\t\t}\r\n\t};\r\n};\r\n\/\/ \r\nthis.button1_btn.onRollOver = \r\nthis.button2_btn.onRollOver = function () {\r\n\tthis._alpha = 50;\r\n\t_root.MyCustomRollSmall(this._name + \" onRollOver\");\r\n};\r\nthis.button1_btn.onRollOut = \r\nthis.button2_btn.onRollOut = function () {\r\n\tthis._alpha = 90;\r\n\t_root.MyCustomRollSmall(this._name + \" onRollOut\");\r\n};\r\n\/\/ debug \/ trace functions\r\nfunction MyCustomRoll(txt:String) {\r\n\tthis.debug_txt.text = txt;\r\n}\r\nfunction MyCustomRollSmall(txt:String) {\r\n\tthis.debug2_txt.text = txt;\r\n}\r\n<\/pre>\n","protected":false},"excerpt":{"rendered":"
This is a problem which is kinda difficult to describe in short sentence. But this is a problem which I seem to be running into for a couple of weeks now. Lets descibe the problem and I will illustrate with a banner (or a simple flv-player) example: The banner (rectangle) is contains a short animation […]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,7],"tags":[],"class_list":["post-32","post","type-post","status-publish","format-standard","hentry","category-flash","category-flash-video-player"],"aioseo_notices":[],"aioseo_head":"\n\t\t\n\t\n\t\n\t\n\t\n\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t