Created
October 15, 2018 02:50
-
-
Save amdrade/af394e928b7720c8f5ab74dfb5081b3c to your computer and use it in GitHub Desktop.
Full Canlendar com coluna de horários fixa para visão dia
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.table-responsive .fixed-column { | |
position: absolute; | |
display: inline-block; | |
width: auto; | |
border-right: 1px solid #ddd; | |
opacity: 0; | |
top: 0; | |
z-index: 3; | |
background: #fff; | |
color: #2d2d2d; | |
-webkit-transition: opacity .25s linear, box-shadow .25s linear; | |
-o-transition: opacity .25s linear, box-shadow .25s linear; | |
transition: opacity .25s linear, box-shadow .25s linear; | |
} | |
.table-responsive .fixed-column tr:first-child td:first-child { | |
border-top: none; | |
} | |
.table-responsive .fixed-column.ativo { | |
opacity: 1; | |
box-shadow: 0 0 5px rgba(0,0,0,.35); | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function fnScroll() { | |
if (!$('[name=visao_dia]').val()) { | |
return; | |
} | |
var $table = $('#calendar table.table .fc-slats > table'), | |
$skeleton = $('#calendar table.table .fc-content-skeleton'), | |
widthFCTime = 40, | |
marginFCTime = 8, | |
$fixedColumn = $table.clone().insertAfter($skeleton).addClass('fixed-column'); | |
$fixedColumn.find('th:not(:first-child),td:not(:first-child)').remove(); | |
$fixedColumn.find('tr').each(function (i, elem) { | |
$(this).height($table.find('tr:eq(' + i + ')').height()); | |
}); | |
var $divScroll = $('#calendar .fc-agenda-view.table-responsive'); | |
var lastX = $divScroll.scrollLeft(); | |
$divScroll.on('scroll', function(e){ | |
var currX = $divScroll.scrollLeft(), | |
posLeft = (currX - marginFCTime); | |
$fixedColumn.css({ | |
'left': posLeft +"px" | |
}).toggleClass('ativo', currX >= widthFCTime); | |
lastX = currX; | |
}); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment