Sprung zum Seitenanfang bei Links ohne Ziel (#) verhindern

javascript-slider-bullets

Bei der Arbeit mit JavaScript werden häufig „leere“ Links in der HTML-Struktur angelegt, die dazu dienen ein Event auszulösen. Beispielsweise soll in einem Slider um ein Bild nach rechts navigiert werden. Der Link-Aufbau sieht dann in der Regel so aus: <a href="#">Button</a>. Klickt nun allerdings ein Besucher auf den Button, springt die Seite nach oben und der User muss erneut nach unten scrollen um den Slider zu sehen. Sehr benutzerunfreundlich.

Da ich in den vergangenen Wochen mehrere Anfragen zu diesem Thema erhalten habe, möchte ich die Lösung gerne öffentlich posten.

Trainings für Unternehmen und Privatpersonen

Wir machen dich fit für die Zukunft des Web! In unseren Seminaren und Workshops lernst du wie moderne Websites entstehen.

Infos zu Inhouse-Seminaren
Infos zu öffentlichen Terminen

javascript:return false;

Die Lösung ist denkbar einfach. Anstelle einer Raute (#) muss das Anker-Ziel javascript:return false; lauten. Euer Link sieht also so aus:

<a href="javascript:return false;">Button</a>

Anschließend springt die Website nicht länger im Browser nach oben, wenn ein Besucher den „leeren“ Link anklickt.