完整日历调整方向更改

时间:2013-02-25 20:58:48

标签: jquery css ipad fullcalendar

我正在使用完整的日历,当我的设备(iPad)的方向发生变化时,我无法调整大小。

容器的尺寸很好,但日历却没有。任何帮助,建议或提示将不胜感激!谢谢!

的JavaScript

//When the orientation changes
window.addEventListener("orientationchange", function() {
    //Resize the container first
    $("#calendarWrapper").css({
      width: $(document).width() * 0.8
    }); 

    //Resize the calendar
    $("#calendar").fullCalendar("windowResize");
    //$("#calendar").fullCalendar("render"); //Doesn't work either

    //Position the container to be in the middle
    $("#calendarWrapper").css({
      marginLeft: $("#calendar").width() / 2 * -1,
      marginTop:  $("#calendar").height() / 2 * -1
    }); 
}, false);

初始CSS

#calendarWrapper{
  position:absolute;
  visibility: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  top: 50%;
  left: 50%;
  margin-left: 0px;
  margin-top: 0px;
  padding: 10px;
  border-radius: 10px;
  border: 1px solid #afafaf;
  background-color: #fff;
  z-index: 1001;
  opacity: 1;
}

0 个答案:

没有答案