日期選擇器模式向下滾動頁面

我正在使用Material Design並使用其日期選擇器。當日期選擇器彈出時，頁面向下滾動。我怎樣才能加載日期選擇器模式沒有頁面向下滾動？日期選擇器模式向下滾動頁面

$('.datepicker').datepicker({ 
    ... 
    beforeShow: function(input, inst) 
      { 
       inst.dpDiv.css({position: 'absolute'}); 
      } 
    ... 
});

在那裏，您可以設置日期選擇器的對話框的位置：

<input id="client-edit-birth-date" type="text" class="datepicker validate"> 
    $('.datepicker').pickadate({ 
selectMonths: true, // Creates a dropdown to control month 
selectYears: 15, // Creates a dropdown of 15 years to control year, 
container: 'body' 
});

來源

2016-07-26 baig772

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script> 
    <link rel="stylesheet" type="text/css" media="screen" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/base/jquery-ui.css"> 
<script type="text/javascript"> 
$(function() { 
    $('.date-picker').datepicker({ 
     changeMonth: true, 
     changeYear: true, 
     showButtonPanel: true, 
     dateFormat: 'MM yy', 
     onClose: function(dateText, inst) { 
      $(this).datepicker('setDate', new Date(inst.selectedYear, inst.selectedMonth, 1)); 
     } 
    }); 
}); 
</script> 
<style> 
.ui-datepicker-calendar { 
    display: none; 
    } 
</style> 
</head> 
<body> 
    <label for="startDate">Date :</label> 
    <input name="startDate" id="startDate" class="date-picker" /> 
</body> 
</html>

demo http://jsfiddle.net/DBpJe/5106/

來源

2016-07-26 12:32:33

我利用日期選擇器的功能beforeShow做到這一點。你必須嘗試找出哪種css參數更適合你的情況/頁面佈局。

來源

2016-07-26 13:20:48

日期選擇器模式向下滾動頁面

回答

相關問題