MySQL interesse |
|
Mensen kunnen foto's uploaden, wanneer ze de eerste foto hebben geselecteerd komt pas de volgende rij tevoorschijn.
Maar om dat ik style="display:none;" in mijn <li> zet verliest hij de breedte die hij normaal zou moeten hebben (85px) als hij tevoorschijn komt.
Ik heb even borders rond de lists gezet zodat je de breedte goed kan zien.
http://bricksfactor.com/liporb.jpg
<li id="img1_1">Foto 1</li>
<li id="img1_2"><input type="file" name="img1" value="<?=$_FILES['img1']['name']?>" onChange="next_imgwrap(2);" size="52"></li><br>
<li id="img2_1" style="display:none;">Foto 2</li>
<li id="img2_2" style="display:none;"><input type="file" name="img2" value="<?=$_FILES['img2']['name']?>" onChange="next_imgwrap(3);" size="52"></li><br>
<li id="img3_1" style="display:none;">Foto 3</li>
<li id="img3_2" style="display:none;"><input type="file" name="img3" value="<?=$_FILES['img3']['name']?>" onChange="next_imgwrap(4);" size="52"></li><br>
<li id="img4_1" style="display:none;">Foto 4</li>
<li id="img4_2" style="display:none;"><input type="file" name="img4" value="<?=$_FILES['img4']['name']?>" onChange="next_imgwrap(5);" size="52"></li><br>
<li id="img5_1" style="display:none;">Foto 5</li>
<li id="img5_2" style="display:none;"><input type="file" name="img5" value="<?=$_FILES['img5']['name']?>" onChange="next_imgwrap(6);" size="52"></li><br>
<li id="img6_1" style="display:none;">Foto 6</li>
<li id="img6_2" style="display:none;"><input type="file" name="img6" value="<?=$_FILES['img6']['name']?>" size="52"></li>
<li id="img1_1">Foto 1 </li> <li id="img1_2"><input type="file" name="img1" value="<?=$_FILES['img1']['name']?>" onChange="next_imgwrap(2);" size="52"> </li><br> <li id="img2_1" style="display:none;">Foto 2 </li> <li id="img2_2" style="display:none;"><input type="file" name="img2" value="<?=$_FILES['img2']['name']?>" onChange="next_imgwrap(3);" size="52"> </li><br> <li id="img3_1" style="display:none;">Foto 3 </li> <li id="img3_2" style="display:none;"><input type="file" name="img3" value="<?=$_FILES['img3']['name']?>" onChange="next_imgwrap(4);" size="52"> </li><br> <li id="img4_1" style="display:none;">Foto 4 </li> <li id="img4_2" style="display:none;"><input type="file" name="img4" value="<?=$_FILES['img4']['name']?>" onChange="next_imgwrap(5);" size="52"> </li><br> <li id="img5_1" style="display:none;">Foto 5 </li> <li id="img5_2" style="display:none;"><input type="file" name="img5" value="<?=$_FILES['img5']['name']?>" onChange="next_imgwrap(6);" size="52"> </li><br> <li id="img6_1" style="display:none;">Foto 6 </li> <li id="img6_2" style="display:none;"><input type="file" name="img6" value="<?=$_FILES['img6']['name']?>" size="52"> </li>
#ul_new_ad li{
display:inline-table;
text-align:left;
}
#img1_1,#img2_1,#img3_1,#img4_1,#img5_1,#img6_1{
border:1px solid #000;
padding:10px;
width:85px;
}
#img1_2,#img2_2,#img3_2,#img4_2,#img5_2,#img6_2{
border:1px solid #000;
padding:10px;
width:auto;
}
#ul_new_ad li{ display:inline-table; text-align:left; } #img1_1,#img2_1,#img3_1,#img4_1,#img5_1,#img6_1{ border:1px solid #000; padding:10px; width:85px; } #img1_2,#img2_2,#img3_2,#img4_2,#img5_2,#img6_2{ border:1px solid #000; padding:10px; width:auto; }
function next_imgwrap(nr)
{
document.getElementById('img'+nr+'_1').style.display = "inline";
document.getElementById('img'+nr+'_2').style.display = "inline";
}
function next_imgwrap(nr) { document.getElementById('img'+nr+'_1').style.display = "inline"; document.getElementById('img'+nr+'_2').style.display = "inline"; }
Wikipedia.org: Google.be:
|