How to create the effect of pictures thrown in a table?

I'd like to create the effect of having a bunch of pictures in the table (thr开发者_开发知识库own out, no specific order, pieces of pictures covering other pictures, vertical, horizontal, skewed, etc) and also when the user hovers over an image it gets big, but I have no idea how to get started. What I've got so far is an image list automatically generated (in a ul) out of a folder in the server. Could anyone please give me some pointers as to how to get this done?

My question is how to do this? I've never done any effect remotely like this or always searched for plugins but I'd like to do this one myself.

EDIT

Breaking down the project:

• Load pictures from folder (this part I already did)
• Display them randomly on the browser (I don't know how to make the images appear as if they were a bunch of pictures thrown into a table, unorganized, some on top of others, rotated in different angles) this is where I have more trouble.
• Have the images grow to a large size on hover. (I can do this)
• If clicked, the image displays some extra info (this I am unsure, but I'm guessing I'll be adding a div and just dynamically filling it up with info of the clicked image)?

This is my version of the "thrown" effect:

HTML:

<ul id="x">
    <li>&nbsp;</li>
    <li>&nbsp;</li>
    <li>&nbsp;</li>
    <li>&nbsp;</li>
    <li>&nbsp;</li>
    <li>&nbsp;</li>
    <li>&nbsp;</li>
    <li>&nbsp;</li>
    <li>&nbsp;</li>
    <li>&nbsp;</li>
</ul>

Javascript:

var list = document.getElementById('x');
var elements = list.getElementsByTagName('li');
for (var i=0; i<elements.length; i++) {
    // random positon between 0px and 300px
    elements[i].style.left = Math.ceil(Math.random()*300) + 'px';
    elements[i].style.top = Math.ceil(Math.random()*300)+ 'px';

    // random angle between -90 and 90 degrees
    var rot = 'rotate(' + (Math.ceil(Math.random()*180) - 90) + 'deg)';
    elements[i].innerHTML = rot;
    // Firefox rotation
    elements[i].style.MozTransform = rot;
    // Safari/Chrome rotation
    elements[i].style.WebkitTransform = rot;
    // Opera Rotation
    elements[i].style.OTransform = rot; 
    // all the rest
    elements[i].style.roration = Math.ceil(Math.random()*180) - 90;
}

jsFiddle Demo