title: Highlight daterange in jQuery UI datepicker on hover
body: <p>I'm having some trouble with my jQuery UI Datepicker.
  I've managed to make it highlight my daterange when I select a start and end date (e.g. 2015/12/02 - 2015/12/08) - then the dates between is highlighted in a green color.</p>
  
  <p>My question is now - can I highligt a daterange BEFORE I select an end date? </p>
  
  <p>Here's an example: 
  <a href="http://stephencelis.github.io/timeframe/#example_information" rel="nofollow">http://stephencelis.github.io/timeframe/#example_information</a></p>
  
  <p>When I select a startdate, it highlights the daterange until I select my desired end-date. I'm not sure if it's something that can be done in jQuery UI Datepicker - and if not, then I have to find something else - but it's worth a try asking in here :)</p>
  
  <p>Here is my code so far:</p>
  
  <pre><code>$(function() {
  
  var disabledDate = ["13-12-2015", "14-12-2015", "15-12-2015"];
  
  $.datepicker.setDefaults($.datepicker.regional["da"]);
  
  $("#datepicker").datepicker({
          minDate: 0,
          /* numberOfMonths: [4,2], */
          numberOfMonths: 2,
          firstDay: 1,
          inline: true,
          beforeShowDay: function(date) {
  
              var string = jQuery.datepicker.formatDate('dd-mm-yy', date);
              if(disabledDate.indexOf(string) == -1) {
  
              } else {
                  return[false, 'disabled-dates'];
              };
  
              var date1 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#chooseDateFrom").val());
              var date2 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#chooseDateTo").val());
              return [true, date1 &amp;&amp; ((date.getTime() == date1.getTime()) || (date2 &amp;&amp; date &gt;= date1 &amp;&amp; date &lt;= date2)) ? "selected-dates" : ""];
  
          },
          onSelect: function(dateText, inst) {
  
              var date1 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#chooseDateFrom").val());
              var date2 = $.datepicker.parseDate($.datepicker._defaults.dateFormat, $("#chooseDateTo").val());
  
              var selectedDate = $.datepicker.parseDate($.datepicker._defaults.dateFormat, dateText);
  
              if (!date1 || date2) {
  
                  $("#chooseDateFrom").val(dateText);
                  $("#chooseDateTo").val("");
  
                  $(this).datepicker("option", "minDate", dateText);
  
              } else if( selectedDate &lt; date1 ) {
  
                  $("#chooseDateTo").val( $("#chooseDateFrom").val() );
                  $("#chooseDateFrom").val( dateText );
  
                  $(this).datepicker("option", "minDate", dateText);
  
              } else {
  
                  $("#chooseDateTo").val(dateText);
  
                  $(this).datepicker("option", "minDate", null);
  
              }
          }
  });
  });
  </code></pre>
  
  <p>I hope someone can help me a bit :) I'm kinda stuck here :/</p>