Q:

Randomly position divs on page load

I am looking to randomly position a batch of DIVs on screen when the page loads - I'd also like their opacity value and size to be random on load. Any tips on how to achieve this? Looking to do this all with jQuery by the way // thanks

A:

for (var i=1; i <= 3; i++) {
    // Minimum 0 and maximum 60%. You can change that.  
    var x = Math.max(0, Math.min(60, Math.ceil(Math.random() * 100)));
    var y = Math.max(0, Math.min(60, Math.ceil(Math.random() * 100)));
    $('<div />').css({
        position: 'absolute',
        width: '300px',
        height: '100px',
        top: y + '%',
        left: x + '%',
        'background-color': 'rgba(0,0,0,' + Math.random() + ')'
    }).text('top:' + y + ', left:' + x).appendTo('body');
}

http://jsfiddle.net/hspvadfv/
it's your turn now to play with Math and change var x and y.

