Antwort an „einsiedler“ verfassen

Hallo,

Ja, dafür braucht man kein JavaScript. Aber was hat das mit deinem Button Link zu tun, der erscheinen soll, wenn der Nutzer ein bisschen runtergescrollt hat?

Da direkt noch nichts, richtig, aber wenn der link einmal betätigt ist wird ja smooth heraufgesrollt, und beim (momentan) von mir genannten "Inhaltsverzeichnis" zu den datierten Artikeln heruntergescrollt.

Als JS habe ich neben dem üblichen jquery.min.js:

smooth-scroll.js

// Select all links with hashes
$('a[href*="#"]')
// Remove links that don't actually link to anything
    .not('[href="#"]')
    .not('[href="#0"]')
    .click(function(event) {
        // On-page links
        if (
            location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '')
            &&
            location.hostname == this.hostname
        ) {
            // Figure out element to scroll to
            var target = $(this.hash);
            target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
            // Does a scroll target exist?
            if (target.length) {
                // Only prevent default if animation is actually gonna happen
                event.preventDefault();
                $('html, body').animate({
                    scrollTop: target.offset().top
                }, 600, function() {
                    // Callback after animation
                    // Must change focus!
                    var $target = $(target);
                    $target.focus();
                    if ($target.is(":focus")) { // Checking if the target was focused
                        return false;
                    } else {
                        $target.attr('tabindex','-1'); // Adding tabindex for elements not focusable
                        $target.focus(); // Set focus again
                    }
                });
            }
        }
    });

und noch button-menue.js

function globalClickManager(ev){
		// ev.target gibt uns das Element auf dem der Click geschah.

		// steuere expanded Buttons
		if(ev.target.hasAttribute("aria-expanded") ){
		ev.target.setAttribute("aria-expanded", ( ev.target.getAttribute("aria-expanded") == "false") ); 
			}
		// Buttons die lediglich den Click transferieren ähnlich zu label Elementen
		else if(ev.target.hasAttribute("data-for-id") ){
			document.getElementById( ev.target.getAttribute("data-for-id") ).click();
			}
		else if( Element.prototype.closest){
			if( ev.target.closest("nav") == null ){
				var temp = document.querySelector("nav [aria-expanded='true']");
				if(temp) temp.setAttribute("aria-expanded","false");
			}
		}
	}
	function init(){
		var col = document.querySelectorAll("nav [aria-expanded]");
		for(var i=0; i<col.length; i++){
			col[i].setAttribute("aria-expanded","false");
		}
		document.body.addEventListener("click",globalClickManager);
		}
	document.addEventListener("DOMContentLoaded", init, false);

Aber wie gesagt, beides möchte ich herausschmeissen, das erstere JS auf jeden Fall da genügt der Einzeiler: html {scroll-behavior: smooth;}. Für was genau das zweitere JS war, weiß ich nicht mehr. Also weg.

Ich schaue mir mal genauer Deine Verlinkungen an.

Momentan probiere ich folgendes: Wenn ich schon nicht das korrekte grid-row-ende zufassen bekomme, mache ich es umgekehrt: Nicht Angefangen von der Link-Oberkante bis ganz runter zum grid-row-ende (das ja nicht akzeptiert wird) sondern von der LINK-Unterkante bis rauf zum grid-row-start.

Ich gebe also einen Scrollbereich meinetwegen 90vh (wenn überhaupt vh anerkannt wird) und setze den link ans untere Ende, mal sehen wie dann das Scrollverhalten ist. Villeicht habe ich damit mehr Erfolg und das grid-raster-ende wird jetzt akzeptiert.

Das probiere ich noch aus bevor ich mich Deinen Workarround zuwende.

So lieber Felix. soviel zu Deinem Einzeiler, jetzt trete mal in Aktion.

Ist er doch schon. Du hast seinen Rat ignoriert.

Sag ich nichts zu.

Da sag ich jetzt mal auch nichts zu.

? Ähm...

Gruß der einsiedelnde

freiwillig, öffentlich sichtbar
freiwillig, öffentlich sichtbar
freiwillig, öffentlich sichtbar

Ihre Identität in einem Cookie zu speichern erlaubt es Ihnen, Ihre Beiträge zu editieren. Außerdem müssen Sie dann bei neuen Beiträgen nicht mehr die Felder Name, E-Mail und Homepage ausfüllen.

abbrechen