Php countdown, make the div change width for every day - php

Question

Hey i have made a countdown, but what i want is a div that change width after the day.
Let's say there is 150 days back to someday, then i want the div to be 150px in width. Is this possibel? I have seach all over the web.

Answer 1

it's simple. store start date and update div via counting difference with now. Every 150 days re-store start date.
here's some pseudocode
var start=17/01/2013 //stored date
func countDifference(){
return differenceIs=now()-start+1;
}
func setWidth(){
div.width=countDifference();
}

Answer 2

For a purely php method, you could assign a class to the div based on the number of days, but then you'd need a css style specified for every single possible width.
It would be better to do it via javascript - Sugar's answer contains a basic method.
You could also use the css method in jQuery to change a css width attribute.
http://api.jquery.com/css/

Answer 3

You can do one thing like given below..
<div id="test" style='background-color:red;color:white;display:block;width:150px;'>asdasdsdasda</div>
<script>
$(document).ready(function(e){
var today = new Date();
var startday = new Date('01/15/2013');
var width = 150;
var diff = DateDiff(new Date(today),new Date(startday));
diff = parseInt(diff);
var val = parseInt(parseInt(diff) / parseInt(width));
if( val >= 1 ){
diff = parseInt(parseIn(diff) - parseInt(width * val));
}
var now_width = width - diff;
$('#test').css('width' , parseInt(now_width));
function DateDiff(date1, date2) {
var datediff = date1.getTime() - date2.getTime();
return (datediff / (24*60*60*1000));
}
});
</script>
Please check url given below
JsFiddle Example
I hope it will be helpful for you.
thanks