<html>
<head>
<style>
.casella{
border:2px solid blue;
width:200px;
height:100px;
position:absolute;
}
</style>
<script>
var casella;
window.onload=main;
function main(){
casella=document.createElement("div");
casella.className="casella";
document.body.appendChild(casella);
}
</script>
</head>
<body>
</body>
</html>
Questo crea una semplice casella ex novo... come già sapevamo...
Possiamo anche creare una funzione ex novo...
<html>
<head>
<style>
.casella{
border:2px solid red;
width:200px;
height:100px;
position:absolute;
}
</style>
<script>
var casella;
window.onload=main;
function main(){
creaCasella("div","casella");
}
function creaCasella(tipo,classe){
casella=document.createElement(tipo);
casella.className=classe;
document.body.appendChild(casella);
}
</script>
</head>
<body>
</body>
</html>
Bene. Ovviamente funziona...
Ora introduciamo le coordinate...Ma dobbiamo calcolare le righe e le colonne.
Ecco un modo di usare l'operazione modulo per calcolare il numero delle celle contenute in una colonna:
<html>
<head>
<style>
.casella{
border:2px solid red;
width:200px;
height:10px;
position:absolute;
}
</style>
<script src="../librerie/funzioni.js"></script>
<script>
var casella;
window.onload=main;
function main(){
for(var n=0;n<7;n++){
creaCasella("div","casella",0,30*(n%7));
}
}
function creaCasella(tipo,classe, sinistra, alto){
casella=document.createElement(tipo);
casella.className=classe;
casella.style.top=alto+"px";
casella.style.left=sinistra+"px";
document.body.appendChild(casella);
}
</script>
</head>
<body>
</body>
</html>
Nessun commento:
Posta un commento