Toon posts:

AppendChild -> Border color

Pagina: 1
Acties:

Verwijderd

Topicstarter
Okey,

ik word gek! De code:
Zoals je kan zien, hebben de style selectors gewoon Border == ZWART

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
<html>
  <head>
    <style>

.empty{border:2px solid #000000;background:#FF00FF;}
.sold{border:2px solid #000000;background:#CCCCCC;}
.house{border:2px solid #000000;background:#996600;}
.shop{border:2px solid #000000;background:#FF0000;}
.bank{border:2px solid #000000;background:#00CC00;}
.game{border:2px solid #000000;background:#CC3300;}
.factory{border:2px solid #000000;background:#FFCC00;}
.police{border:2px solid #000000;background:#3366FF;}

.emptySelected{border:2px solid #FFFF00;background:#FFFFFF;}
.soldSelected{border:2px solid #FFFF00;background:#CCCCCC;}
.houseSelected{border:2px solid #FFFF00;background:#996600;}
.shopSelected{border:2px solid #FFFF00;background:#FF0000;}
.bankSelected{border:2px solid #FFFF00;background:#00CC00;}
.gameSelected{border:2px solid #FFFF00;background:#CC3300;}
.factorySelected{border:2px solid #FFFF00;background:#FFCC00;}
.policeSelected{border:2px solid #FFFF00;background:#3366FF;}

.street{background:#999999;}
.grass{background:#00FF33;}
.water{background:#0099FF;}

    </style>
    <script type="text/javascript">

var oPrevCell = null;
var oPrevClass = null;

var iSize = 20;

var aTypes = new Array();
aTypes[0] = {"width":1, "height":1, "type":"Straat", "class":"street"};
aTypes[1] = {"width":1, "height":1, "type":"Gras", "class":"grass"};
aTypes[2] = {"width":1, "height":1, "type":"Water", "class":"water"};
// Leeg, wanneer de ruimte nog onbebouwd is
aTypes[5] = {"width":2, "height":2, "type":"Onbebouwde grond", "class":"empty"};
aTypes[4] = {"width":2, "height":2, "type":"Verkochte grond", "class":"sold"};
aTypes[3] = {"width":2, "height":2, "type":"Huis", "class":"house"};
aTypes[6] = {"width":2, "height":2, "type":"Winkel", "class":"shop"};
aTypes[7] = {"width":2, "height":2, "type":"Bank", "class":"bank"};
aTypes[8] = {"width":2, "height":2, "type":"Politie", "class":"police"};
aTypes[9] = {"width":2, "height":2, "type":"Spel", "class":"game"};
aTypes[10] = {"width":4, "height":2, "type":"Fabriek", "class":"factory"};

function init() {
  var s = "0,0,0|0,0,1|...edited@drm";

  var myBoard = new Board();
  myBoard.setBoard(s);
}

function Board() {

  var newTable = document.createElement("TABLE");
  document.body.appendChild(newTable);
  newTable.cellSpacing = 0;
  newTable.cellPadding = 0;
  var newTbody = document.createElement("TBODY");
  newTable.appendChild(newTbody);
  var newRow = document.createElement("TR");
  newTbody.appendChild(newRow);

  this.setBoard = function (s) {

    var aParts = s.split("|");
    for (var i = 0; i < aParts.length; i++) {
      var sPart = aParts[i];
      if (sPart.toUpperCase() == "X") {
        newRow = document.createElement("TR");
        newTbody.appendChild(newRow);
      } else {
        var newCell = document.createElement("TD");
        newRow.appendChild(newCell);
        var aAttr = sPart.split(",");
        newCell.className = aTypes[parseInt(aAttr[0])]["class"];
        newCell.building = parseInt(aAttr[0]);
        newCell.owner = parseInt(aAttr[1]);
        newCell.number = parseInt(aAttr[2]);
        newCell.colSpan = aTypes[parseInt(aAttr[0])]["width"];
        newCell.rowSpan = aTypes[parseInt(aAttr[0])]["height"];
        newCell.style.width = iSize * aTypes[parseInt(aAttr[0])]["width"];
        newCell.style.height = iSize * aTypes[parseInt(aAttr[0])]["height"];
      }
    }
  }
}

    </script>
  </head>
  <body onload="init()">

  </body>
</html>


Wanneer je deze code uitvoert, wordt er wel een border
weergegeven, maar het is onmogelijk om hem een kleurtje te geven...

Enig idee? Ook Mozilla doet het niet wat ik verwacht...

op regel 78 krijgt elke cell zijn className... Alleen wordt hij niet goed
weergegeven... Bug?

edit:
beetje leesbaarder zo

[ Voor 56% gewijzigd door drm op 07-02-2004 21:29 ]


  • drm
  • Registratie: Februari 2001
  • Laatst online: 09-06-2025

drm

f0pc0dert

Ik wil niet vervelend zijn, maar je hebt toch echt in de classes staan dat de border zwart moet zijn. Die **Selected klassen ken je nergens toe.

edit:
of bedoel je de background color?

[ Voor 14% gewijzigd door drm op 07-02-2004 21:33 ]

Music is the pleasure the human mind experiences from counting without being aware that it is counting
~ Gottfried Leibniz


Verwijderd

Topicstarter
Het probleem is dat de kleur niet zwart wordt...
Je ziet een border maar die is gewoon wit. Wat je ook doet
die border blijft wit. Of je nou .style.borderColor aanpast, maakt niet
uit...

  • McVirusS
  • Registratie: Januari 2000
  • Laatst online: 11-05 10:29
Cascading Stylesheet:
1
2
3
4
newTable.style.borderCollapse = "collapse";
newCell.style.borderColor = "#000";
newCell.style.borderWidth = "1px";
newCell.style.borderStyle = "solid";


Werkt prima, ik denk dat de truuk 'm in de borderCollapse goed zetten zit ;).