71 lines
2.3 KiB
JavaScript
71 lines
2.3 KiB
JavaScript
|
jQuery(document).ready(function($) {
|
||
|
$('.custom-comment-icon').on('click', function() {
|
||
|
// Animált görgetés a kommentekhez
|
||
|
$('html, body').animate({
|
||
|
scrollTop: $('.comments').offset().top
|
||
|
}, 1000); // 1000 ms = 1 másodperces görgetés
|
||
|
});
|
||
|
});
|
||
|
|
||
|
jQuery(document).ready(function($) {
|
||
|
function positionFixedDiv() {
|
||
|
var referenceDiv = $('.container');
|
||
|
var fixedDiv = $('.custom-comment-icon-wrapper');
|
||
|
var tooltip = $('.custom-tooltip');
|
||
|
var footer = $('footer');
|
||
|
var stopOffset = 600; // Megállási távolság a lábléc felett
|
||
|
|
||
|
if (referenceDiv.length && fixedDiv.length && footer.length) {
|
||
|
var offset = referenceDiv.offset();
|
||
|
var leftPosition = offset.left - fixedDiv.outerWidth() - 20;
|
||
|
var scrollTop = $(window).scrollTop();
|
||
|
var windowHeight = $(window).height();
|
||
|
var footerTop = footer.offset().top;
|
||
|
var fixedDivHeight = fixedDiv.outerHeight();
|
||
|
|
||
|
// Ellenőrizzük, hogy a bal pozíció negatív-e
|
||
|
if (leftPosition < 0) {
|
||
|
leftPosition = 20;
|
||
|
}
|
||
|
|
||
|
// Számítsuk ki a maximális top értéket
|
||
|
var maxTop = footerTop - stopOffset - fixedDivHeight;
|
||
|
|
||
|
// Állítsuk be a margint
|
||
|
var marginTop = Math.min(scrollTop, maxTop);
|
||
|
|
||
|
fixedDiv.css({
|
||
|
'position': 'fixed',
|
||
|
'left': leftPosition + 'px',
|
||
|
'margin-top': marginTop + 'px',
|
||
|
'margin-bottom' : '300px'
|
||
|
});
|
||
|
|
||
|
// Tooltip pozícionálása
|
||
|
if (tooltip.length) {
|
||
|
tooltip.css({
|
||
|
'left': '-30px',
|
||
|
'top': '-120px' // 120px-el a wrapper felett
|
||
|
});
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
// Hívjuk meg, amikor az oldal betöltődik
|
||
|
positionFixedDiv();
|
||
|
|
||
|
// Frissítsük az elhelyezést, amikor az ablak méretét változtatják vagy görgetnek
|
||
|
$(window).on('resize scroll', function() {
|
||
|
positionFixedDiv();
|
||
|
});
|
||
|
|
||
|
// Tooltip megjelenítése 5 másodperc után
|
||
|
setTimeout(function() {
|
||
|
$('.custom-tooltip').fadeIn();
|
||
|
}, 5000);
|
||
|
|
||
|
// Bármilyen kattintásra a tooltip eltűnik
|
||
|
$(document).on('click', function() {
|
||
|
$('.custom-tooltip').fadeOut();
|
||
|
});
|
||
|
});
|