JavascriptProva

giovedì 28 marzo 2013

Ecco la disposizione delle caselle in colonne ben realizzata!

Per prima cosa definire il numero delle caselle che si vuole, quindi l'altezza delle colonne.

Ecco: trovata la soluzione: 30 caselle disposte in 4 colonne di 7 elementi col resto di due.
<html>
<head>
<style>
.casella{
 border:1px solid red;
 width:200px;
 height:20px;
 position:absolute;
}
</style>

<script src="../librerie/funzioni.js"></script>

<script>
var casella;
var CaselleInColonna;
var NumeroCaselle;

window.onload=main;
NumeroCaselle=30;
CaselleInColonna=7;
function main(){
 for(var n=0;n<NumeroCaselle;n++){
  casella=document.createElement("div");
  document.body.appendChild(casella);
  casella.className="casella";
  casella.style.top=(EN(casella.currentStyle.height)*(n%CaselleInColonna))+"px";
  casella.style.left=(EN(casella.currentStyle.width)*(Math.floor(n/CaselleInColonna)))+"px";
 }
}
</script>
</head>
<body>

</body>
</html>

1 commento:

  1. Le dimensioni vengono definite in fase di foglio di stile, mentre la posizione viene calcolata nel corso della creazione.

    RispondiElimina