Mache .modalDialog
position: fixed
anstelle von absolute
. Dadurch wird es immer dort positioniert, wo die Seite gerade gescrollt wird.
Ein vollständigeres Beispiel: Ссылка
(Es gibt noch andere Tricks in dieser Codepen-Demo - das Hinzufügen eines weiteren Ziels zur Schaltfläche "Schließen" auf dem Modal, das auch fixed
enthält, verhindert das Scrollen der Seite, wenn das Modal geschlossen wird, und das Ändern der z-index
Ihres Modals von -1
bis 100
(oder einer anderen geeigneten großen Ganzzahl) verhindert, dass Klicks direkt nach dem Schließen blockiert werden.)
Das hat eigentlich nichts mit CSS zu tun, es ist einfach altes HTML.
Sie haben in Ihrem Link eine Hash-ID, die auf ein Element auf der Seite verweist. Jeder Browser würde die Seite zu dem referenzierten Element scrollen, wenn auf diese Verknüpfung geklickt wird. Das ist sehr Standardverhalten.
Sie können das nicht verhindern, indem Sie diese Technik nicht verwenden. Nun, vielleicht gibt es eine Möglichkeit, Scrollen mit JavaScript Black Magic zu verhindern, aber Sie sollten nicht.
Verwenden Sie stattdessen jQuery: Ссылка
Haben Sie den css3: Fokus-Selektor ausprobiert?
Auch
CSS-Menü - Behalten Sie die Maustaste gedrückt, während Sie auf das Untermenü
Sie können stattdessen auch ein <button>
-Tag verwenden und es wie gewünscht formatieren. Das würde verhindern, dass deine Seite springt, da es kein Anker ist.
Tags und Links css