如何使FullCalendar在觸摸設備上工作？

我正在尋找平板電腦友好的活動日曆，但我沒有找到任何合適的。但FullCalendar是在桌面和平板電腦上看起來不錯的最佳jQuery日曆插件。如何使FullCalendar在觸摸設備上工作？

這個日曆在桌面上完美運行，但是對於平板電腦，我無法選擇基於觸摸和滑動的事件的開始時間和結束時間。當我這樣做日曆滾動。有沒有解決方案？我一直在四處尋找解決方案。

有沒有人有這個問題，你解決了嗎？請分享你如何解決它的方法。任何形式的幫助表示讚賞。

在此先感謝。

來源

2012-05-31 Dipin Krishnan

您是否試過包括Jquery UI Touch Punch？

默認情況下，Jquery UI不支持觸摸事件，因爲它並未針對移動設備進行優化。 Touch Punch解決了我使用Jquery UI拖動的問題拖動&拖放功能，這似乎也被FullCalendar使用。

希望它有幫助！

來源

2012-05-31 12:09:09 gwythen

我看過這個解決方案[here]（http://code.google.com/p/fullcalendar/issues/detail?can=2&start=0&num=100&q=&colspec=ID%20Type%20Status ％20Milestone％20Summary％20Stars＆GROUPBY =＆排序=＆ID = 724）。拖動周圍事件對我來說工作得很好，但是，我無法根據觸摸拖動周視圖/日視圖來選擇時間段來創建事件。你是如何解決這個問題的？你能幫我解決嗎？ –

@DipinKumar你有沒有找到解決方案？ – John

@John肯定會嘗試使用jQuery Touch Punch。 –

這個作品

我用這個插件：jquery.ui.touch.js

增加Fullcalendar iOS和觸摸支持Android設備

只是用它來初始化您的日曆：

eventRender: function(event, element) { 
      $(element).addTouch(); 
     }

來源

2014-09-24 13:54:15 Gotschi

在Android上工作，謝謝。 –

比jQuery Touch Punch效果更好，就像@yndolok解決方案一樣，您可以放置事件並且不會自動更正它們的位置以適合其父容器的邊緣。 – Seether

請確保使用最新的jQueryUI，否則它將不起作用。此時我正在使用1.11.4。最新的fullcalendar使用最新的jQuery 2.x. – Mistergreen

由於我努力讓這個工作與jQuery UI觸摸衝牀，我無法fi找到任何完整的示例代碼，我想我會發布我用於在移動設備上創建和拖動事件的代碼：

注意：此示例使用jQuery UI touch punch。

$(document).ready(function() { 

    $('#calendar').fullCalendar({ 
    ... 
    eventAfterRender: function(event, element, view) { 
     element.draggable(); 
    } 
    }); 

    $('.fc-view tbody').draggable(); 
});

來源

2014-11-19 19:07:57 yndolok

根據this FullCalendar blog post，FullCalendar觸摸支持可用於v2.7.0的測試版。

來源

2016-03-28 23:26:14 akivajgordon

我用這個插件：jquery.ui.touch.js

它通過該代碼爲我工作：

$('#calendar').fullCalendar({ 
[...] 
}); 

$('#calendar').addTouch();

來源

2016-04-18 04:51:53 Pasdo

有了最新 Full Calendar 2.7.1，觸感Supported。你甚至可以設置選項按下延遲。看看文檔

來源

2016-05-02 11:24:34 Ckappo

如何使FullCalendar在觸摸設備上工作？

回答

相關問題