window.addEvent('domready', function(){
	var el = $$('#postsbox1 li'),
        color = el.getStyle('backgroundColor');

    $$('#postsbox1 li').addEvents({
        mouseenter: function(){
            // Cursore da posizionare per ogni div
            this.setStyle('cursor','pointer');

            // Cambio il colore del background on mouseover
            this.morph({
    	        'background-color': '#eef9fc',
                'background-image': 'url(images/frecciacyan.png)', //Immagine background
                'background-repeat': 'no-repeat',
                'background-position': [0, 520], //immagine in movimento da sinistra a destra - valori in pixels
                'border': '10px solid #00CCFF'
            });
		},
        mouseleave: function(){
            // Morphe allo stato originale
            this.morph({
                'border': '10px solid #00CCFF',
                'background-image': 'none',
                'background-color': '#fff',
            });
        }
    });


    // Prendo i link (href) e lo assegno a ogni LI per fare la intera regione cliccabile
    var link = $$('#postsbox1 li a');
    link.each(function(element) {
        element.getParent().addEvent('click', function(){
            window.location = element.get('href');
            // quando clicco, il colore di background e il bordo cambiano colore
            this.morph({
                'border': '10px solid #eee',
                'background-image': 'none',
                
            });
        });
    });
	
	
	
	
	var el = $$('#postsbox2 li'),
        color = el.getStyle('backgroundColor');

    $$('#postsbox2 li').addEvents({
        mouseenter: function(){
            // Cursore da posizionare per ogni div
            this.setStyle('cursor','arrow');

            // Cambio il colore del background on mouseover
            this.morph({
    	        'background-color': '#fdecf4',
                'background-image': 'url(images/frecciamag.png)', //Immagine background
                'background-repeat': 'no-repeat',
                'background-position': [0, 520], //immagine in movimento da sinistra a destra - valori in pixels
                'border': '10px solid #D83E72'
            });
		},
        mouseleave: function(){
            // Morphe allo stato originale
            this.morph({
                'border': '10px solid #D83E72',
                'background-image': 'none',
                backgroundColor: color
            });
        }
    });


    //Prendo i link (href) e lo assegno a ogni LI per fare la intera regione cliccabile
    var link = $$('#postsbox2 li a');
    link.each(function(element) {
        element.getParent().addEvent('click', function(){
            window.location = element.get('href');
            // quando clicco, il colore di background e il bordo cambiano colore
            this.morph({
                'border': '10px solid #eee',
                'background-image': 'none',
                
            });
        });
    });
	
	
	
});
