diff --git a/scp/css/scp.css b/scp/css/scp.css index 4dd7cef3afd1c4cf0b48512b451375e6146e447f..5867a3e68974fad96b672ad8e43df496fd1572c9 100644 --- a/scp/css/scp.css +++ b/scp/css/scp.css @@ -2208,9 +2208,9 @@ td.indented { left: 0; z-index: 6; width: 100%; - border-bottom: 5px solid #ffffff; background-color: white; - padding: 10px 20px 5px; + background-color: rgba(255,255,255,0.9); + padding: 10px 20px; box-sizing: border-box; box-shadow: 0 3px 10px rgba(0,0,0,0.3); } diff --git a/scp/js/scp.js b/scp/js/scp.js index d1c73fc8bf47f33a938b5194803683a234a90534..8621a7d79215a2d44837fb51d20f7b0cb0343f7d 100644 --- a/scp/js/scp.js +++ b/scp/js/scp.js @@ -442,7 +442,7 @@ var scp_prep = function() { // Make sticky bars float on scroll // Thanks, https://stackoverflow.com/a/17166225/1025836 - $('.sticky.bar').each(function() { + $('div.sticky.bar:not(.stop)').each(function() { var $that = $(this), placeholder = $('<div class="sticky placeholder">').insertBefore($that), offset = $that.offset(), @@ -451,12 +451,21 @@ var scp_prep = function() { stopAt, visible = false; + if (stop.length) { + var onmove = function() { + // Recalc when pictures pop in + stopAt = stop.offset().top; + }; + $('#ticket_thread .thread-body img').each(function() { + this.onload = onmove; + }); + onmove(); + } + $that.find('.content').width($that.width()); $(window).scroll(function (event) { // what the y position of the scroll is var y = $(this).scrollTop(); - if (stop.length) - stopAt = stop.offset().top - $that.height(); // whether that's below the form if (y >= top && (!stopAt || stopAt > y)) { @@ -464,18 +473,22 @@ var scp_prep = function() { if (!visible) { visible = true; setTimeout(function() { - placeholder.height($that.height()); $that.addClass('fixed').css('top', '-'+$that.height()+'px') .animate({top:0}, {easing: 'swing', duration:'fast'}); + placeholder.height($that.height()); + $that.find('[data-dropdown]').dropdown('hide'); }, 1); } } else { // otherwise remove it - visible = false; - setTimeout(function() { - placeholder.removeAttr('style'); - $that.stop().removeClass('fixed'); - }, 1); + if (visible) { + visible = false; + setTimeout(function() { + placeholder.removeAttr('style'); + $that.find('[data-dropdown]').dropdown('hide'); + $that.stop().removeClass('fixed'); + }, 1); + } } }); }); diff --git a/scp/js/ticket.js b/scp/js/ticket.js index 9e731a756fccbb9bb3e889833901ad456a406659..a2a131e0243676586a20277d48db3c71603d3686 100644 --- a/scp/js/ticket.js +++ b/scp/js/ticket.js @@ -426,10 +426,18 @@ var ticket_onload = function($) { $.showImagesInline($('#ticket_thread').data('imageUrls')); - var last_entry = $('#ticket_thread .thread-entry').last().offset().top - 50; - $('html, body').animate({ - scrollTop: last_entry - }, 1000); + var last_entry = $('#ticket_thread .thread-entry').last(), + frame = 0; + $('html, body').delay(500).animate({ + scrollTop: last_entry.offset().top - 50, + }, { + duration: 750, + step: function(now, fx) { + // Recalc end target every few frames + if (++frame % 6 == 0) + fx.end = last_entry.offset().top - 50; + } + }); }; $(ticket_onload); $(document).on('pjax:success', function() { ticket_onload(jQuery); });