Hallo ihr Lieben,
ich habe folgendes Problem und finde einfach keine Lösung, vielleicht kann mir Jemand helfen:
Ich habe einen Onepager mit einer Ankernavigation - die Navigation sitzt fixed und bei Klick auf die Anker scrollt man zur jeweiligen Position, soweit funktioniert alles. Wenn ich jedoch die Seite mit einem Anker unabhängig von der Navigation lade, dann greift der Code zum Scrollen zur jeweiligen Position nicht und meine Inhalte sind abgeschnitten..
Code
<script>
// smooth scrolling
function screenMin1651() {
'use strict';
var mq = window.matchMedia("(min-width: 1651px)");
return mq.matches;
}
function screenMax1650() {
'use strict';
var mq = window.matchMedia("(max-width: 1650px)");
return mq.matches;
}
console.log(screenMin1651() + " " + screenMax1650());
if (screenMin1651()) {
var $root = $('html, body');
$('a[href*=#]:not([href=#])').click(function() {
'use strict';
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top-145
}, 800);
return false;
}
}
});
}
if (screenMax1650()) {
var $root = $('html, body');
$('a[href*=#]:not([href=#])').click(function() {
'use strict';
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top-90
}, 800);
return false;
}
}
});
}
</script>
Alles anzeigen