Thursday, January 12, 2012

Bit of fun with JQuery and CSS

I stole some time to play a bit more with veritas and JQuery today. Instead of the ugly list that I had before, I wanted some interactivity. So I got started by adding a little css to make a "card" for each bottle.

 .bottle
{
width:300px;
background-color:rgba(0,0,0,.5);
}
Then I wrote a bit of javascript to make each div that I pass into the html into a JQuery "draggable", and do a bit of cheap layout.

    else if(signal == "add_bottle")
{
div = jQuery(data,{}).draggable();
div.css('position','absolute');
div.css('left', lft);
div.css('top',tp);
lft += 10;
tp += 10;
$( "#bottle_div" ).append(div);
}
Next I'll add some nicer layout. Then I'll start adding filters and dropdowns so I can sort and do other fun stuff.