html {
width:100%;
}
Comment changer le CSS du html dynamiquement en cliquant sur le bouton en utilisant JavaScript? Je veux dire que je veux faire le CSS HTML ci-dessus comme écrit ci-dessous. Mais je dois changer cela dynamiquement en utilisant le script. Pouvons-nous faire cela?Comment changer la balise « html » CSS de l'élément
html {
width:100%;
overflow-y: hidden;
}
Il y a probablement un moyen plus simple, mais
htmlTags = document.getElementsByTagName("html")
for(var i=0; i < htmlTags.length; i++) {
htmlTags[i].style.overflowY = "hidden";
}
Espoir je me suis souvenu de tout droit.
Tout d'abord, je ne recommanderais pas de réglage styles sur l'élément html directement. La balise body est censée être le nœud supérieur de la liste d'affichage DOM, et Firefox interprétera les styles appliqués à html comme styles appliqués à body de toute façon. Les autres navigateurs peuvent se comporter différemment.
Comme mentionné, je recommande d'apprendre l'un des frameworks javascript populaires. Ils font des choses comme ça (déplacement et manipulation de HTML) un peu plus faciles. En l'état, vous pouvez écrire le code suivant à l'aide des méthodes DOM standard. Cela nécessite un élément avec un identifiant de "bouton" placé quelque part dans votre balisage.
<a id="button" href="#">Action!</a>
Ajouter ce qui suit à une balise de script dans <head>, ou dans un script externe (recommandé).
window.onload = function(e) {
var button = document.getElementById("button");
button.onclick = function(e) {
document.body.style.overflowY = "hidden";
return false;
}
}
Alternativement, si vous voulez utiliser jQuery:
$(document).ready(function() {
$("#button").click(function(){
$(document.body).css({ overflowY: "hidden");
});
});
ah merci, je ne pense pas que je propriétés de style jamais mis avec des tirets avant – Samuel
Cet exemple, si cela fonctionne (je ne l'ai pas pris la peine de vérifier , et ne peut pas se souvenir de lui-même), gagnerait simplement à tirer la première valeur, car il ne devrait (idéalement) être qu'une seule balise HTML. HtmlTags = document.getElementsByTagName ("html") [0] .style.overflowY = "hidden"; –