0
J'ai un code qui fonctionne très bien et j'ai beaucoup aidé ici. La seule chose est dat le tableau joueurs sortie ne sont pas très bien alignés les uns avec les autres dans une table.Sortie de tableau Javascript dans le tableau
Ma question est, comment peut-on modifier ce code (lecteurs de tableau de sortie) pour qu'il soit bien aligné?
<html>
<head>
<title>Lotto van Terwijn</title>
<body>
<p><img src="../lotto/images/terwijn.png" width="547" height="188"></p>
<style type="text/css">
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
background-color: #FFFFFF;
}
.name {
color: #000000;
font-weight: bold;
margin-right: 0.5em;
}
.picks, .picks * {
display: inline;
margin: 0;
padding: 0;
list-style-type: none;
}
.picks * {
margin: auto 0.25em;
color: Yellow;
}
.win { color: #ffcc00; font-weight: bold }
.loss { color: #ff0000; font-weight: bold }
.drawNum, #Draws H3 {
margin-bottom: 0;
}
</style>
<script type="text/javascript" src="http://jquery.com/src/jquery-latest.js"> </script>
<div id="players"></div>
<div id="draws"></div>
<script type="text/javascript">
var players = {
Joop : ["6","8","16","18","26","28","32","36","38","41"],
Marijke: ["7","10","14","18","24","29","30","34","39","40"],
Michel : ["4","5","11","16","21","27","33","36","42","44"],
Mario : ["6","9","18","25","32","35","39","40","43","45"],
Diana : ["2","6","8","17","22","23","33","36","42","45"],
Agnes : ["3","5","10","15","26","29","32","37","41","44"],
Chris : ["5","7","8","9","11","12","16","28","30","32"],
Jeannette: ["1","2","4","7","8","11","13","28","30","38"],
Wieger: ["1","2","3","7","10","13","14","22","23","27"],
Anita: ["6","13","15","17","21","26","32","33","43","45"],
Thea: ["1","3","5","7","10","17","19","20","22","38"],
Danny: ["3","7","11","15","22","28","32","37","40","43"],
Cindy: ["2","4","16","18","21","24","33","38","41","44"],
Hanneke: ["1","3","4","12","18","21","25","30","36","40"],
Willem: ["3","9","17","21","27","33","35","39","41","42"]
};
var draws = [ {
when: 'Datum: Zaterdag 08-08-2009',
picks:[2, 13, 15, 18, 21, 41]
},
{
when: 'Datum: Zaterdag 15-08-2009',
picks:[6, 19, 24, 25, 35, 37]
},
{
when: 'Datum: Zaterdag 22-08-2009',
picks:[8, 17, 23, 26, 37, 42]
}
];
var buildPlayers = function(){
var cont = $("#players");
for(player in players){
var html = ["<div>","<span class='name'>"+player+"</span>", "<ol class='picks'>"];
for(var i = 0; i < players[player].length; i++){
html.push("<li class='loss pick_"+players[player][i]+"'>"+players[player][i]+"</li>");
}
html.push("</ol>","</div>");
cont.append(html.join(""));
}
};
var buildDraws = function(){
var cont = $("#draws");
for(var i = 0; i < draws.length; i++){
var html = ["<div class='draw'>","<h4 class='drawNum'>Trekking "+(i+1)+"</h3>","<div class='date'>"+draws[i].when+"</div>","<ol class='picks'>"];
for(var j = 0; j < draws[i].picks.length; j++) {
var img = '<img src="http://www.lotto.nl/static/images/ballen/lotto/l'
+ draws[i].picks[j]
+ '.jpg" alt="'
+ draws[i].picks[j]
+ '" />';
html.push("<li>"+img+"</li>");
showWin(draws[i].picks[j]);
}
html.push("</ol>","</div>");
cont.append(html.join(""));
}
};
var showWin = function(winNum){
$(".pick_"+winNum).removeClass("loss").addClass("win");
};
$(function(){
buildPlayers();
buildDraws();
});
</script>
</body>
</html>
Si l'on considère que la durée de vie est très bonne, on peut penser que les chiffres ne sont pas vraiment alignés. Je pense que c'est parce qu'ils viennent dans un tableau, y a-t-il un moyen de les aligner séparément? Personnellement, je ne sais pas comment l'implémenter dans une table avec javascript. Je l'ai vu avec document.print, mais je pense que cela ne correspond pas à ce type de codage. – Chris