Originariamente inviata da
lucavizzi
Nella moltiplicazione devi usare conta.length, non conta[0].length
conta[0] è un riferimento al primo link della collezione e non ha una proprietà “length”
Vero.
Le istruzioni corrette, o per lo meno le uniche a non darmi undefined nei controlli con l'alert, sono:
codice:
var conta = idDestrotag.getElementsByTagName("a").length; // punto ai link del div che voglio gestire
var hComposta = document.getElementsByClassName("headercontent")[0].offsetHeight + 23*conta;
Ho qualche difficoltà nell'intuire dove collocare ogni volta l'indice della collezione o il richiamo al valore: essendo getElementsByTagName("a") una serie di tag nel div cui punta destrotag, mi veniva naturale indicizzare lì lo [0], invece già length mi fornisce il numero di elementi nella collezione.
Ora sta di fatto che il div, scrollando, non si ferma nella posizione corretta e crea anche qualche difetto grafico nel layout.
La funzione completa è questa, analoga a un'altra perfettamente funzionante quando la pagina è caricata a risoluzione maggiore (gestisco con un if quale funzione avviare e ho risolto un conflitto preesistente).
codice:
function fermaScrollSmart() {
var idSide = document.getElementById("side"); // elemento di controllo (div del button)
var statoSide = window.getComputedStyle(idSide).display; // punto al valore interessante dell'elemento di controllo
if (statoSide != "none") { // se il button è visibile sono su smartphone, quindi ok!
idHeader = document.getElementById("header"); // elemento da cui prendere la posizione del div da inserire
var idDestrotag = document.getElementById("destrotag"); // div che voglio gestire
var conta = idDestrotag.getElementsByTagName("a").length; // punto ai link del div che voglio gestire
var hComposta = document.getElementsByClassName("headercontent")[0].offsetHeight + 23*conta; // calcolo l'height del div che voglio gestire
var fixTop = hComposta + idHeader.offsetHeight - window.innerHeight; // calcolo di quanto il div può salire
var correzioneY = - hComposta + window.innerHeight; // calcolo la correzione per fermare il div
window.onscroll = function scrolla() {
if (window.pageYOffset > fixTop) {
idDestrotag.style.position = "fixed";
idDestrotag.style.top = correzioneY + "px";
} else {
idDestrotag.style.position = "static";
idDestrotag.style.top = "0px";
}
}
}
}
La funzione è richiamata da un onload nel <body>. Spero i commenti siano esaustivi: siccome inizialmente destrotag ha display: none, per determinare la sua posizione iniziale a priori faccio riferimento all'header che lo sovrasta con position: fixed e quindi è sempre visibile e "leggibile" da JS.