日が列ごとに上から下に配置されるカレンダーを作成する必要があるため、テーブルをdivで変更しました。カレンダーは正常に動作していますが、イベントがうまく表示されません。イベントは [ある日] 上の隅に配置されます。毎日のイベントを正しく表示する必要があり、新しいイベントを作成する必要があります。手伝って頂けますか?
function buildSkeleton(maxRowCnt, showNumbers) {
var s;
var headerClass = tm + "-widget-header";
var contentClass = tm + "-widget-content";
var i, j,k;
var table;
console.log("maxRowCnt:",maxRowCnt);
console.log("rowCnt:",rowCnt);
console.log("colCnt:",colCnt);
s =
"<div class='main1' id='body' style='width:100%' >";
for (i=0; i<rowCnt; i++) {//1
k=100/rowCnt;
s +=
"<div class='fc-week" + i + " weeks' style='width:"+ k +"% ;float:left;'>" ;
for (j=0; j<colCnt; j++) {//7
s +=
"<div class='fc-" + contentClass + " fc-day" + (i*colCnt+j) + " weekday'>" + // need fc- for setDayID
"<span class='fc- " + headerClass + "'/>"+
"<div>" +
(showNumbers ?
"<div class='fc-day-number'/>" :
''
) +
"<div class='fc-day-content'>" +
"<div style='position:relative'> </div>" +
"</div>" +
"</div>" +
"</div>" ;
}
s +=
"</div >" ;
}
s +=
"</div>";
table = $(s).appendTo(element);
console.log("table:",table);
body = table.find('.main1');
console.log("body:",body);
bodyRows = table.find('.weeks');
console.log("bodyRows:",bodyRows);
bodyCells = table.find('.weekday');
console.log("bodyCells:",bodyCells);
headCells = bodyCells.find('span');
console.log("headCells:",headCells);
bodyFirstCells = bodyCells.filter(':first-child');//bodyCells.filter(':first-child');
console.log("bodyFirstCells:",bodyFirstCells);
bodyCellTopInners = bodyRows.find('div .fc-day-content div');
console.log("bodyCellTopInners:",bodyCellTopInners);
markFirstLast(bodyRows); // marks first+last td's
bodyRows.addClass('fc-first'); // fc-last is done in updateCells
dayBind(bodyCells);
daySegmentContainer =
$("<div style='position:absolute;z-index:8;'/>")
.appendTo(element);
}