gpt4 book ai didi

css - 完整日历无法与语义 UI 一起正常工作

转载 作者:行者123 更新时间:2023-11-28 03:20:25 25 4
gpt4 key购买 nike

我使用 Semantic-ui v2.2.11 和 fullCalendar v3.4.0,我的问题是 dayClick 事件不适用于月份部分日历的每一天,如果我从 semantic-ui 中删除导入 css日历工作正常。我不太了解css,但为什么会这样?

My JsFiddle

HTML

<!DOCTYPE html>
<html>
<head>

<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

<title>#{get 'title' /}</title>
<link rel="stylesheet" type="text/css" href="@{'/public/semantic-2.2.10/dist/semantic.css'}">
<link rel="stylesheet" href="@{'/public/fullcalendar 3.4.0/dist/fullcalendar.min.css'}">

#{get 'moreStyles' /}

<!-- Scripts -->
<script src="@{'/public/jquery-3.2.1/dist/jquery.js'}"></script>
<script src="@{'/public/moment/min/moment.min.js'}"></script>
<script src="@{'/public/fullcalendar 3.4.0/dist/fullcalendar.min.js'}"> </script>
<script src="@{'/public/fullcalendar 3.4.0/dist/locale/es.js'}"></script>
<script src="@{'/public/semantic-2.2.10/dist/semantic.js'}"></script>

#{get 'moreScripts' /}
</head>
<body>
<div class="ui secondary pointing menu">
<a class="active item">
Home
</a>
<div class="right menu">
<a class="ui item">
Logout
</a>
</div>
</div>
<div class="ui vertical left aligned segment">
<div class="ui container">
<h1>My calendar</h1>
<p><a href="@{testCalendarSemantic}">Refresh</a></p>
<div id="calendar"></div>
</div>
</div>
</body>
</html>

JS

$(function() {
$('body #calendar').fullCalendar({
navLinks: true,
header:{
left:'prev',
center:'title',
right:'next'
},
footer:{
left:'today',
center:'',
right:'month,agendaDay,agendaWeek,list'
},
dayClick:function(){
$(this).css('background-color','#cce6ff');
},
events:[
{
title:'first event',
start: '2017-06-15 09:00',
end:'2017-06-17 20:00',
},
{
title:'first event',
start: '2017-07-21 07:00',
end:'2017-07-24 23:00',
},
{
title:'first event',
start: '2017-08-01 10:00',
end:'2017-08-05 16:00',
}
]
});
});

enter image description here

最佳答案

可以通过设置容器的css来解决这个问题:

height: auto

关于css - 完整日历无法与语义 UI 一起正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45243329/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com