jQuery Rotate SirusOS

fun rotate transform with percentage scaling

by Ben Clayton

HTML

<div class="spin"></div>

CSS

.spin {
        position:absolute;
        left:150px;
        top:100px;
        width: 258px;
    	height: 100px;
}

.spin div {
    width: 258px;
	height: 100px;
    xborder:1px solid red;
    background-image:url("http://vanilla.infxsolutions.com/images/SIRIUS_POS_F.png")
}

.spin div {
    -webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	     -o-transform: rotate(45deg);
	        transform: rotate(45deg);
}

JavaScript

function rec (obj,n,r,g,b){
       
       var d=document.createElement('div');
       obj.append(d);
       //obj.left(n*2);
       //obj.top(n*2);
       if(n<8){
           rec($(d),n+1,r+5,g,b+3);
       }
    }
    
    rec($(".spin"),1,100,100,22);
    $('div').on('mouseover',function(){
        $(this).addClass("sel");
    });
    $('div').on('mouseout',function(){
        $(this).removeClass("sel");
    });