Sujet Précédent Sujet Suivant

Menu fixe apres scroll

@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 - 18 mai 2017 à 17:53
@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 - 1 juin 2019 à 20:11

Cette discussion concerne un article du site. Pour la consulter dans son contexte d'origine, cliquez sur le lien ci-dessous.

https://codes-sources.commentcamarche.net/source/101976-menu-fixe-apres-scroll

@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 153
Modifié le 1 juin 2019 à 20:13

le choix que j'ai fait est l'abstraction afin de donner un id différent aux éléments ou ne pas en donner, donner n’importe quelle nom de class afin de créer des styles différent pour chaque element. La seule contrainte est de mettre un data attribut data-stic en precisant la position. Apres ca j' en convient qu'utiliser

document.getElementsByTagName("*")

force le parcoure de tous les elements d'une page mais esse vraiment important pour ca il faudrait faire les teste sur une page tres lourde.

Sinon ce que j'ai chercher a faire c'est ce que propose le framwork angular en spécifiant des attribut.

concernant hasAttribute il fait partie du dom level 2 sortie en 2000 qui fait 19 ans et qui est supporté par tous les navigateurs depuis leurs debut seul ie le supporte a partir de la version 8 et trop peut de personnes utilise les versions antérieur.

pour height:100% je voit pas l’intérêt vue qu'il est définit en fonction de la hauteur du contenu.

m0rganana Messages postés 2 Date d'inscription vendredi 31 mai 2019 Statut Membre Dernière intervention 31 mai 2019
31 mai 2019 à 14:24

Si l'on veut assurer une compatibilité totale avec les vieux navigateurs, il faut créer un tableau d'éléments en utilisant getElementById et éviter d'utiliser la méthode hasAttribute qui n'existe pas sur ces vieux navigateurs. Le plus simple reste de donner une classe à ces objets et d'utiliser la méthode getElementsByClassName. Il n'y a pas de nécessité de récupérer tous les noeuds et de les parcourir un à un pour tester si l'attribut existe, même sur une page dynamique.

@karamel Messages postés 1855 Date d'inscription vendredi 9 mai 2008 Statut Modérateur Dernière intervention 18 avril 2024 153
31 mai 2019 à 10:51

je veut bien te croire mais pourquoi l'utilisation de

document.getElementsByTagName('*')

est moche que propose tu comme meilleur solution ?

m0rganana Messages postés 2 Date d'inscription vendredi 31 mai 2019 Statut Membre Dernière intervention 31 mai 2019
Modifié le 31 mai 2019 à 10:12

Attention car c'est du code sale (voire très sale).
Pensez à ajouter :

html, body{
 height:100%;
}

...si vous utilisez le nouveau doctype (<!doctype html>) sinon l'image ne s'affichera pas.

Le code JavaScript est catastrophique, que dire de l'utilisation de

document.getElementsByTagName('*')

:s
La partie JS demanderait à être entièrement réécrite car c'est pas du tout comme ça qu'il faut faire.

Alkekange
17 oct. 2018 à 11:27

Réflexion faite : je vois que ça marche ! Ce qui m'a perturbé c'est tout cet espace noire autour du menu...

Alkekange
17 oct. 2018 à 11:16

Ce menu qui devrait être fixe ne l'est pas chez moi. J'ai pourtant bien créer un dossier res ou j'ai mis stic.css et stic.js, et d'ailleurs j'ai pu voir que le menu est bien joli habillé par son css ! Pourquoi ça ne marcherait pas ? Merci de bien vouloir me répondre. Cordialement. Jean-Michel

Menu fixe apres scroll

Votre réponse

Discussions similaires