I have been playing with YUI3 for a while. Some one with a background in prototype.js and jQuery will find YUI3 bit complicated. To me YUI always sounded like JS toolkit developed by some c++/Java programmer who hated web developers to the core. Well YUI3 tries to be friendly. It took me just 15 minutes to write down the following code:
<html>
<head>
<title>YUI says Hello World!</title>
</head>
<body id="doc-body">
<div id="rgbvalues"> </div>
<script src="http://yui.yahooapis.com/3.3.0/build/yui/yui-min.js" charset="utf-8"></script>
<script type="text/javascript">
//use node and event modules
YUI().use("node", "event", function(Y){
var handleClick = function(e) {
var docBody = Y.one("#doc-body"); //equivalent to $(element) in prototype and jQuery(element)
var winHeight = docBody.get('winHeight');//get "viewport" height
var winWidth = docBody.get('winWidth');//get "viewport" width
var red = parseInt (e.pageX * (255/winWidth));
var green = parseInt(e.pageY * (255/winHeight));
var blue = parseInt (red*green*0.004);
var bgstyle = "rgb("+red+","+green+"," +blue+")";
docBody.setStyle("background-color", bgstyle);//same as $(element).setStyle() from prototype and jQuery(element).css()
Y.one("#rgbvalues").set("innerHTML", bgstyle);//set innerHTML
};
Y.on("mousemove", handleClick, "#doc-body");
});
</script>
</body>
</html>
Easy!
As I am not so good at maths I wasn’t able to write a formula or function that could translate mouse motion into color values, so I simply wrote down my stupid conversion 
.
