Ecrire du css en javascript
Soyez le premier à donner votre avis sur cette source.
Snippet vu 8 606 fois - Téléchargée 28 fois
Contenu du snippet
Vous créez un tableau...
Vous désirez avoir ses largeurs de colonnes définies en % selon la définition de l'écran. On les calcule en javascript, on definit les classes en css. Mais le css ne prend pas les variables du javascript.
On entre donc le css en javascript !
La suite n'est que le début d'un html, à vous le reste...
Notez que le css s'enchaine, cascading
la suite par <td class="c1" etc... bien entendu
a+
Vous désirez avoir ses largeurs de colonnes définies en % selon la définition de l'écran. On les calcule en javascript, on definit les classes en css. Mais le css ne prend pas les variables du javascript.
On entre donc le css en javascript !
La suite n'est que le début d'un html, à vous le reste...
Notez que le css s'enchaine, cascading
Source / Exemple :
<script type="text/javascript" LANGUAGE="JavaScript">
largfen = screen.width;
var largc1 = largfen * 0.15;
var largc2 = largfen * 0.70;
var largc3 = largfen * 0.30;
var largc4 = largfen * 0.40;
var largc5 = largfen * 0.15;
</script>
<style type="text/css">
p.bodT
{margin:10px 5px 10px 5px; padding: 12px 5px 12px 15px;
font-family: "Arial", sans-serif;font-size:12px;font-weight:700;text-align: left; vertical-align: middle;
border-width: 2px; border-style: dashed; border-color: #823389; color:#823389;background-color: #FFDB00;
}
.bod
{margin:0px 0px 0px 0px; padding: 0px 0px 0px 0px;
font-family: "Arial", sans-serif;
font-size:12px;color:#006C80;font-weight:300;text-align: justify;
}
td.c5 {margin: 0px; padding: 2px; vertical-align: top;}
</style>
<script type="text/JavaScript">
document.write("<style type='text/css'>");
document.write("table.tt {width:"+ largfen +"; }");
document.write("td.c1 {width:"+ largc1 +";margin: 0px; padding: 5px; vertical-align: top;}");
document.write("td.c2 {width:"+ largc2 +";margin: 0px; padding: 5px; vertical-align: top;}");
document.write("td.c3 {width:"+ largc3 +";margin: 0px; padding: 5px; vertical-align: middle;}");
document.write("td.c4 {width:"+ largc4 +";margin: 0px; padding: 5px; vertical-align: middle;}");
document.write("</style>");
</script>
Conclusion :
la suite par <td class="c1" etc... bien entendu
a+
A voir également
- Document.write css
- #ffdb00 - Meilleures réponses
- Document write style - Meilleures réponses
- Javascript : Coloration php, css, html, javascript - CodeS SourceS - Guide
- PHP : Cjo - css and javascript optimizer - CodeS SourceS - Guide
- Javascript : Quiz html css et javascript - CodeS SourceS - Guide
- Menu déroulant vertical html css sans javascript - Guide
- Onglet css sans javascript - Guide
Commentaires
Est ce qu'il serait possible de mettre plus d'explications comme le code doit être insérer ou et comment dois-je faire le lien avec ma page principale???
Merci!!!
Est ce qu'il serait possible de mettre plus d'explications comme le code doit être insérer ou et comment dois-je faire le lien avec ma page principale???
Merci!!!
Vous n'êtes pas encore membre ?
inscrivez-vous, c'est gratuit et ça prend moins d'une minute !
Les membres obtiennent plus de réponses que les utilisateurs anonymes.
Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.
Le fait d'être membre vous permet d'avoir des options supplémentaires.