Hallo,
ich habe das Beispiel etwas umgebaut: http://websara.bplaced.net/webseite/index.html#test1
$(".fancybox").on("click", function () {
$.fancybox($(this).data("href"));
var hash = $(location).attr('hash');
alert(hash);
});
<figure>
<a class="fancybox" rel="group" data-href="bilder/gross.png" title="Ich bin ein Titel">
<img src="bilder/klein.png" title="Ich bin ein Titel" alt="Ich bin ein Alt"/>
</a>
<figcaption class="bildunterschrift">Ich bin eine Bildunterschrift</figcaption>
</figure>
Die Seite springt weiterhin zum Anfang. Wenn ich mir alert(hash); ausgeben lasse, erhalte ich z.B. #test1 dieses ist auch richtig, ich habe daher die Vermutung, dass im JS Teil etwas nicht stimmt bzw. es ein Parameter verloren geht und zwar hier
$('nav a[href^="#"]').on('click', function (e) {
e.preventDefault();
$(document).off("scroll");
$('a').each(function () {
$(this).removeClass('active');
})
$(this).addClass('active');
var target = this.hash;
$target = $(target);
$('html, body').stop().animate({
'scrollTop': $target.offset().top+2
}, 500, 'swing', function () {
window.location.hash = target;
$(document).on("scroll", onScroll);
});
});
});
function onScroll(event){
var scrollPosition = $(document).scrollTop();
$('nav a').each(function () {
var currentLink = $(this);
var refElement = $(currentLink.attr("href"));
if (refElement.position().top <= scrollPosition && refElement.position().top + refElement.height() > scrollPosition) {
$('nav ul li a').removeClass("active");
currentLink.addClass("active");
}
else{
currentLink.removeClass("active");
}
});
Ich denke hier geht ein Wert beim Klick auf das Bild bzw. später beim schließen verloren, deshalb scrollt die Seite nach oben. Dazu fehlen mir leider die nötigen JavaScript Kenntnisse.
@Mely, wenn das Problem hier nicht gelöst werden kann, dann schau vielleicht mal nach einem anderen Forum wo es nur um JS geht, vielleicht ist dort jemand der mehr Ahnung davon hat.