下面是我的代码,我想在div上放置(堆叠)卡片..但只有第一张卡位于-20px,其他所有都被放置为0px..position ....如何解决? :( function myFunction(){ 为(J = 1; J< 8; J ++){
for(i=1;i<7;i++){
if(j<2){
var x = document.createElement("IMG");
x.setAttribute("src", "AllCards/cvr.png");
x.setAttribute("id", "r"+j);
x.setAttribute("width", "auto");
x.setAttribute("height", "auto");
x.setAttribute("alt", "one");
document.getElementById("c"+i).appendChild(x);
alert("r"+j+" c"+i);
//document.getElementById("r"+j).style.position = "relative";
//document.getElementById("r"+j).style.top="20px";
}
else if(j<3){
var x = document.createElement("IMG");
x.setAttribute("src", "AllCards/cover.png");
x.setAttribute("id", "r"+j);
x.setAttribute("width", "auto");
x.setAttribute("height", "auto");
x.setAttribute("alt", "one");
//alert("c"+i);
//alert("r"+j+" c"+i);
document.getElementById("c"+i).appendChild(x);
document.getElementById("r"+j).style.position = "relative";
document.getElementById("r"+j).style.top="-80px";
//alert("r"+j);
}
/*else if(j<4){
var x = document.createElement("IMG");
x.setAttribute("src", "AllCards/cvr.png");
x.setAttribute("width", "auto");
x.setAttribute("height", "auto");
x.setAttribute("alt", "one");
//document.getElementById("c"+i).style.position = "relative";
//document.getElementById("c"+i).style.top="-20px";
document.getElementById("c"+i).appendChild(x);
}
else if(j<5){
var x = document.createElement("IMG");
x.setAttribute("src", "AllCards/cvr.png");
x.setAttribute("width", "auto");
x.setAttribute("height", "auto");
x.setAttribute("alt", "one");
//document.getElementById("c"+i).style.position = "relative";
//document.getElementById("c"+i).style.top="-20px";
document.getElementById("c"+i).appendChild(x);
}
else if(j<6){
var x = document.createElement("IMG");
x.setAttribute("src", "AllCards/cvr.png");
x.setAttribute("width", "auto");
x.setAttribute("height", "auto");
x.setAttribute("alt", "one");
//document.getElementById("c"+i).style.position = "relative";
//document.getElementById("c"+i).style.top="-20px";
document.getElementById("c"+i).appendChild(x);
}
else if(j<7){
var x = document.createElement("IMG");
x.setAttribute("src", "AllCards/cvr.png");
x.setAttribute("width", "auto");
x.setAttribute("height", "auto");
x.setAttribute("alt", "one");
//document.getElementById("c"+i).style.position = "relative";
//document.getElementById("c"+i).style.top="-20px";
document.getElementById("c"+i).appendChild(x);
}
else if(j<8){
var x = document.createElement("IMG");
x.setAttribute("src", "AllCards/cvr.png");
x.setAttribute("width", "auto");
x.setAttribute("height", "auto");
x.setAttribute("alt", "one");
//document.getElementById("c"+i).style.position = "relative";
//document.getElementById("c"+i).style.top="-20px";
document.getElementById("c"+i).appendChild(x);
}
*/
}
}
}
答案 0 :(得分:0)
您是否考虑过将css类设置为属性并将定位细节放入其中? e.g。
x.setAttribute("class", "rClass");
的CSS:
.rClass {
top:-80px;
position:relative;
}