<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"/>
<script src="//code.jquery.com/jquery-1.8.1.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script type="text/javascript">
var d = new Date();
var month = d.getMonth()+1;
var day = d.getDate();
var date1 = d.getMonth() + '/' + (d.getDate()+1) + '/' + d.getFullYear();
console.log(date1);
var events = [];
events[0] = { Title:"Festival 1", Date:new Date("09/27/2014"), Image:"http://lh3.googleusercontent.com/-0g0n4vysSRI/AAAAAAAAAAI/AAAAAAAAAH0/QTviSVwIfkE/s80-c/photo.jpg", Link:"http://imanalicse.blogspot.com" };
events[1] = { Title:"Festival 1", Date:new Date("11/04/2014"), Image:"http://lh3.googleusercontent.com/-0g0n4vysSRI/AAAAAAAAAAI/AAAAAAAAAH0/QTviSVwIfkE/s80-c/photo.jpg", Link:"http://imanalicse.blogspot.com" };
events[2] = { Title:"Festival 1", Date:new Date("09/12/2014"), Image:"http://lh3.googleusercontent.com/-0g0n4vysSRI/AAAAAAAAAAI/AAAAAAAAAH0/QTviSVwIfkE/s80-c/photo.jpg", Link:"http://imanalicse.blogspot.com" };
jQuery(function () {
jQuery("#datepicker").datepicker({
beforeShowDay:function (date) {
var result = [true, '', null];
var matching = jQuery.grep(events, function (event) {
return event.Date.valueOf() === date.valueOf();
});
if (matching.length) {
result = [true, 'highlight loading dt' + date.valueOf(), null];
}
jQuery("#datepicker_loader").html('');
return result;
},
onChangeMonthYear:function (y, m, i) {
setInterval(function () {
myTimer()
}, 3000);
},
onSelect:function (dateText) {
jQuery('.dt' + dateText.valueOf() + " a").attr("href", "tcw");
},
dayNamesMin:['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
});
//jQuery("#datepicker").datepicker('currentText', 'Now');
//jQuery('.ui-datepicker-today').trigger('click');
myTimer();
});
function myTimer() {
var i = 0,
event = null;
while (i < events.length) {
event = events[i];
jQuery('.dt' + event.Date.valueOf()).html('');
if (jQuery('.dt' + event.Date.valueOf()).length) {
jQuery('.dt' + event.Date.valueOf()).html("<div class='event_date_main'><div class='event_popup'><a class='ehvr' style='display:none' href='" + event.Link + "'><span class='chitcw'><img src='" + event.Image + "' alt='' /></span> <span class='chttcw'>" + event.Title + "</span></a></div><a href='javascript:' class='ui-state-default'>" + event.Date.getDate() + "</a></div>");
jQuery('.dt' + event.Date.valueOf()).mouseover(function () {
jQuery(this).find('.ehvr').css('display', 'block');
}).mouseout(function (event) {
jQuery(this).find('.ehvr').css('display', 'none');
});
jQuery('.dt' + event.Date.valueOf()).removeClass('loading');
}
i++;
}
}
</script>
<div class="event_page_datepicker"><div id="datepicker"><span id="datepicker_loader">Loading Event Calender...</span></div></div>
<script src="//code.jquery.com/jquery-1.8.1.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script type="text/javascript">
var d = new Date();
var month = d.getMonth()+1;
var day = d.getDate();
var date1 = d.getMonth() + '/' + (d.getDate()+1) + '/' + d.getFullYear();
console.log(date1);
var events = [];
events[0] = { Title:"Festival 1", Date:new Date("09/27/2014"), Image:"http://lh3.googleusercontent.com/-0g0n4vysSRI/AAAAAAAAAAI/AAAAAAAAAH0/QTviSVwIfkE/s80-c/photo.jpg", Link:"http://imanalicse.blogspot.com" };
events[1] = { Title:"Festival 1", Date:new Date("11/04/2014"), Image:"http://lh3.googleusercontent.com/-0g0n4vysSRI/AAAAAAAAAAI/AAAAAAAAAH0/QTviSVwIfkE/s80-c/photo.jpg", Link:"http://imanalicse.blogspot.com" };
events[2] = { Title:"Festival 1", Date:new Date("09/12/2014"), Image:"http://lh3.googleusercontent.com/-0g0n4vysSRI/AAAAAAAAAAI/AAAAAAAAAH0/QTviSVwIfkE/s80-c/photo.jpg", Link:"http://imanalicse.blogspot.com" };
jQuery(function () {
jQuery("#datepicker").datepicker({
beforeShowDay:function (date) {
var result = [true, '', null];
var matching = jQuery.grep(events, function (event) {
return event.Date.valueOf() === date.valueOf();
});
if (matching.length) {
result = [true, 'highlight loading dt' + date.valueOf(), null];
}
jQuery("#datepicker_loader").html('');
return result;
},
onChangeMonthYear:function (y, m, i) {
setInterval(function () {
myTimer()
}, 3000);
},
onSelect:function (dateText) {
jQuery('.dt' + dateText.valueOf() + " a").attr("href", "tcw");
},
dayNamesMin:['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
});
//jQuery("#datepicker").datepicker('currentText', 'Now');
//jQuery('.ui-datepicker-today').trigger('click');
myTimer();
});
function myTimer() {
var i = 0,
event = null;
while (i < events.length) {
event = events[i];
jQuery('.dt' + event.Date.valueOf()).html('');
if (jQuery('.dt' + event.Date.valueOf()).length) {
jQuery('.dt' + event.Date.valueOf()).html("<div class='event_date_main'><div class='event_popup'><a class='ehvr' style='display:none' href='" + event.Link + "'><span class='chitcw'><img src='" + event.Image + "' alt='' /></span> <span class='chttcw'>" + event.Title + "</span></a></div><a href='javascript:' class='ui-state-default'>" + event.Date.getDate() + "</a></div>");
jQuery('.dt' + event.Date.valueOf()).mouseover(function () {
jQuery(this).find('.ehvr').css('display', 'block');
}).mouseout(function (event) {
jQuery(this).find('.ehvr').css('display', 'none');
});
jQuery('.dt' + event.Date.valueOf()).removeClass('loading');
}
i++;
}
}
</script>
<div class="event_page_datepicker"><div id="datepicker"><span id="datepicker_loader">Loading Event Calender...</span></div></div>