Hi rminde and jay:
I am using IE 8 and IE 9.
I still don't know what is happening,
but I did more testing with different width and figured out that:
any number between 1-160 will result in the width being 280...like this
$('#middle').css('width', 1-160);
$('#middle').width() = 280
any number 400 or more will be the correct number!
$('#middle').css('width', 400);
$('#middle').width() = 400
$('#middle').css('width', 500);
$('#middle').width() = 500
So this part works but only numbers greater then or equal to 400
and in between 160 and 400 it takes anything more then 160 divides it by 2 and adds it to 280. For exampel:
$('#middle').css('width', 160);
$('#middle').width() = 280
$('#middle').css('width', 200);
$('#middle').width() = 300
$('#middle').css('width', 300);
$('#middle').width() = 350
Do you guys have any idea where that might be coming from?
I hope you understand my explanation.
I still have no clue why it acts like this.
I just realized each of my arrows is 80px so this could have something to do with the 160(2 arrows)
And 400 was originality the width of each picture....but that changed
Yeh I'm still trying to figure it out.