JQuery 自定义日历

Question

我有点想创建一个日历，您可以在此处看到：http://fullcalendar.io/

我想将时间作为 X 轴，将不同的名称作为 Y 轴。我使用 JQuery UI 滑块创建了自己的版本：http://rockaholics-cologne.de/root/Timetable.php

感觉使用滑块不是最佳方法。我不是在这里要求代码。但也许你可以告诉我要寻找什么。我想创建这些可调整大小的栏，如第一个 link 中所示，并将它们放在我的布局中，如第二个 link.

中所示

我只是找不到 google 的正确关键字，也许您有什么想法？

谢谢！ :D

Answer 1

这里的 fiddle 将为您提供可调整大小的 div 的良好基础 http://jsfiddle.net/nick_craver/bx2mk/ 我认为这就是您要找的东西。enter code here

$("#resizable").resizable({
    handles: 'e, w'
});

#resizable { width: 150px; height: 50px; padding: 0.5em; }
#resizable h3 { text-align: center; margin: 0; }

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/themes/overcast/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script   src="https://code.jquery.com/ui/1.12.0-rc.2/jquery-ui.min.js"   integrity="sha256-55Jz3pBCF8z9jBO1qQ7cIf0L+neuPTD1u7Ytzrp2dqo="   crossorigin="anonymous"></script>

<div id="resizable" class="ui-widget-content">
    <h3 class="ui-widget-header">Resizable</h3>
</div>

JQuery 自定义日历

JQuery custom calendar

javascript

jquery

jquery-ui-slider