cover photo: some code cleanup and fix height issue when photo was not cached
This commit is contained in:
parent
677ad71b96
commit
4cc413cdaf
@ -3,52 +3,45 @@
|
|||||||
var section_padding_top;
|
var section_padding_top;
|
||||||
var coverSlid = false;
|
var coverSlid = false;
|
||||||
var hide_cover = Boolean({{$hide_cover}});
|
var hide_cover = Boolean({{$hide_cover}});
|
||||||
|
var cover_height;
|
||||||
|
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
if(! $('#cover-photo').length)
|
if(! $('#cover-photo').length)
|
||||||
return;
|
return;
|
||||||
|
|
||||||
aside_padding_top = parseInt($('aside').css('padding-top'));
|
if($(window).width() < 755) {
|
||||||
section_padding_top = parseInt($('section').css('padding-top'));
|
$('#cover-photo').remove();
|
||||||
|
coverSlid = true;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
$('#cover-photo').removeClass('d-none');
|
||||||
|
cover_height = Math.ceil($(window).width()/2.75862069);
|
||||||
|
$('#cover-photo').css('height', cover_height + 'px');
|
||||||
|
datasrc2src('#cover-photo > img');
|
||||||
|
|
||||||
$(document).on('click mouseup keyup', slideUpCover);
|
$(document).on('click mouseup keyup', slideUpCover);
|
||||||
|
|
||||||
if($(window).width() > 755) {
|
|
||||||
$('#cover-photo').removeClass('d-none');
|
|
||||||
datasrc2src('#cover-photo > img');
|
|
||||||
|
|
||||||
if(hide_cover) {
|
if(hide_cover) {
|
||||||
hideCover();
|
hideCover();
|
||||||
}
|
}
|
||||||
|
else if(!hide_cover && !coverSlid) {
|
||||||
if($(window).scrollTop() < $('#cover-photo').height()) {
|
coverVisibleActions();
|
||||||
$('body').css('cursor', 'n-resize');
|
|
||||||
$('.navbar').removeClass('fixed-top');
|
|
||||||
$('main').css('margin-top', - $('nav').outerHeight(true) + 'px');
|
|
||||||
$('main').css('opacity', 0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
$('#cover-photo').remove();
|
|
||||||
coverSlid = true;
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
$(window).scroll(function () {
|
$(window).scroll(function () {
|
||||||
if($(window).width() > 755 && $(window).scrollTop() > $('#cover-photo').height()) {
|
if($(window).scrollTop() > cover_height) {
|
||||||
$('body').css('cursor', '');
|
coverHiddenActions();
|
||||||
$('.navbar').addClass('fixed-top');
|
|
||||||
$('main').css('margin-top', '');
|
|
||||||
$('main').css('opacity', 1);
|
|
||||||
coverSlid = true;
|
coverSlid = true;
|
||||||
}
|
}
|
||||||
else if ($(window).width() > 755 && $(window).scrollTop() < $('#cover-photo').height()){
|
else if ($(window).scrollTop() < cover_height){
|
||||||
if(coverSlid) {
|
if(coverSlid) {
|
||||||
$(window).scrollTop(Math.ceil($('#cover-photo').height()));
|
$(window).scrollTop(cover_height);
|
||||||
setTimeout(function(){ coverSlid = false; }, 1000);
|
setTimeout(function(){ coverSlid = false; }, 1000);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
if($(window).scrollTop() < $('#cover-photo').height()) {
|
if($(window).scrollTop() < cover_height) {
|
||||||
$('body').css('cursor', 'n-resize');
|
$('body').css('cursor', 'n-resize');
|
||||||
$('.navbar').removeClass('fixed-top');
|
$('.navbar').removeClass('fixed-top');
|
||||||
$('main').css('margin-top', - $('nav').outerHeight(true) + 'px');
|
$('main').css('margin-top', - $('nav').outerHeight(true) + 'px');
|
||||||
@ -57,11 +50,13 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
if($('main').css('opacity') < 1) {
|
if($('main').css('opacity') < 1) {
|
||||||
$('main').css('opacity', ($(window).scrollTop()/$('#cover-photo').height()).toFixed(1));
|
$('main').css('opacity', ($(window).scrollTop()/cover_height).toFixed(1));
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
$(window).resize(function () {
|
$(window).resize(function () {
|
||||||
|
cover_height = Math.ceil($(window).width()/2.75862069);
|
||||||
|
$('#cover-photo').css('height', cover_height + 'px');
|
||||||
if($(window).width() < 755) {
|
if($(window).width() < 755) {
|
||||||
$('#cover-photo').remove();
|
$('#cover-photo').remove();
|
||||||
$('.navbar').addClass('fixed-top');
|
$('.navbar').addClass('fixed-top');
|
||||||
@ -75,7 +70,7 @@
|
|||||||
if(coverSlid) {
|
if(coverSlid) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
$('html, body').animate({scrollTop: Math.ceil($('#cover-photo').height()) + 'px' }, 'fast');
|
$('html, body').animate({scrollTop: cover_height + 'px'}, 'fast');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -83,7 +78,21 @@
|
|||||||
if(coverSlid) {
|
if(coverSlid) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
window.scrollTo(0, Math.ceil($('#cover-photo').height()));
|
window.scrollTo(0, cover_height);
|
||||||
|
}
|
||||||
|
|
||||||
|
function coverVisibleActions() {
|
||||||
|
$('body').css('cursor', 'n-resize');
|
||||||
|
$('.navbar').removeClass('fixed-top');
|
||||||
|
$('main').css('margin-top', - $('nav').outerHeight(true) + 'px');
|
||||||
|
$('main').css('opacity', 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
function coverHiddenActions() {
|
||||||
|
$('body').css('cursor', '');
|
||||||
|
$('.navbar').addClass('fixed-top');
|
||||||
|
$('main').css('margin-top', '');
|
||||||
|
$('main').css('opacity', 1);
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user