Ecrire du css en javascript

Commenter

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

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

S'inscrire maintenant

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.

Du même auteur (cs_Deny)