animate({left: -50%}, 'fast') Is this possible?
I'm trying to move a container out of sight by moving it 50% to the left.
the container has a width of 50%.
50% is important because the site is flexible.
example:
<div id="cont" style="overflow:hidden; white-space:nowrap; width:100%">
<div id="cell_cont" style="display:inline-block; width: 50%">
<div id="cell" style="white-space:nowrap">something meaningful</div>
<div id="cell" style="white-space:nowrap">something meaningful</div>
<div id="cell" style="white-space:nowrap">something meaningful</div>
<div id="cell" style="white-space:nowrap">something meaningful</div>
</div>
<div id="cell_cont" style="display:inline-block; width: 50%">
<div id="cell" style="white-space:nowrap">something meaningful</div>
<div id="cell" style="white-space:nowrap">something meaningful</div>
<div id="cell" style="white-space:nowrap">something meaningful</div>
<div id="cell" style="white-space:nowrap">something meaningful</div>
</div>
</div>
// jquery script
$('body').on('click', '#cell', function(){
//pseudo script
cont.append(cell_cont) // add another cell container
prev_cont.animate({left: -50%}, 'fast'); // hide the previous cont container so only two are ever visible
})
//end