2010-06-15 4 views
0

http://img175.imageshack.us/img175/4295/tableissue.png http://img175.imageshack.us/img175/4295/tableissue.pngLe problème HTML/JS/CSS s'agrandit tout seul

Voici l'image pour commencer.

J'ai cette case à cocher, que lorsque vous vérifiez, alors avec jQuery toggle(); il cache que vous voyez dans la première moitié de l'image (#writeComment) et montre #SCtryVOTE (ce que vous voyez dans l'autre moitié de l'image, à droite).

Maintenant, je ne sais pas pourquoi, mais pour une raison quelconque, il se développe quand il est vérifié, pourquoi je ne sais pas, est-ce parce qu'il a besoin de plus de place que cela ou? comment puis-je faire ce travail sans avoir de problèmes quand il est vérifié.

Voici ce codage:

$('#tryout').click(function() { 

    $('#writeComment').toggle(!$(this).attr('checked')); 

    $('#SCtryVOTE').toggle($(this).attr('checked')); 
}); 

la partie script jquery js, Heres la table et divs partie HTML:

<input type="checkbox" id="tryout"> 
<table align="center" width="400" cellpadding="0" cellspacing="1" id="theBoxer"> 
<tr style="background: #686868;"> 
<td align="center" valign="top" width="70" height="25" style="border:1px #FFF solid;">Opret</td> 
<td align="center" valign="top" width="70" height="25" style="border:1px #FFF solid;">Opret</td> 
</td> 
</tr> 
<tr> 
<td align="left" valign="top" width="70" height="112" style=""> 
TEST 
</td> 
<td align="left" valign="top" width="70" height="112" style=""> 
<div id="writeComment"> 
Smid en kommentar:<br> 
<form action="javascript:DoInsert()" method="post"> 
<textarea id="kommentar" name="kommentar"></textarea><br /> 
<input type="hidden" name="fID" id="fID" value="<? echo $_GET["id"]; ?>"> 
<input type="submit" name="Submit" value="Sæt ind!"> 
</form> 
</div> 

<div id="SCtryVOTE" style="display: none;"> 
<form onsubmit="if (!this.comment.cleared) clearContents(document.getElementById('comment')); return true;" action="javascript:DoSCInsert()" method="post"> 
<textarea onfocus=" javascript:clearContents(this); this.cleared=true;" rows="5" cols="40" id="comment" name="comment" <?php if($vis["username"] == $pusername) { echo "DISABLED"; } ?>>Tryk for at skrive. Skal være detaljeret og grundet.</textarea> 
<br>Ja: <input type="radio" value="Y" id="SCvoteY" name="vote"></input> Nej: <input type="radio" id="SCvoteN" value="N" name="vote"> </input> 
<input type="submit" id="SCstem" name="Submit" value="Stem!"> 
</form> 
</div> 

Peut-être que vous avez besoin de la part de CSS aussi pour ces deux boîtes:

#writeComment{ 
position: relative; 
left: 5px; 
top: 10px; 
} 
#SCtryVOTE{ 
position: relative; 
left: 5px; 
top: 10px; 
} 
+0

Umh, il vous aidera si vous utilisez un peu en retrait à peu votre code et de le rendre un peu plus lisible ... –

+0

Eh bien, pour commencer, vous avez un orphelin après la deuxième cellule TD "Opret". –

+0

@Franci Penov Cant voir où je devrais faire cela, quelle partie ne comprenez-vous pas du codage et je vais essayer d'expliquer le mieux que je peux – Karem

Répondre

1

Je crois que le problème est que le <textarea> dans le premier formulaire ne spécifie pas une taille un d la zone de texte dans le seconf spécifie rows="" et cols="".

De plus, le décalage vertical accru peut être dû à la façon dont vous masquez le premier formulaire. Pouvez-vous poster ce code de script aussi?

+0

les rangées et les cols ont fait la solution, merci! – Karem

0

depuis nous ne pouvons pas le format Commentaires

re: @Franci Penov ne peux pas voir où je dois le faire, quelle partie ne pas vous comprendre du codage et je vais essayer d'expliquer le mieux que je peux - Azzyh 1 il ya min

par exemple, Lequel rend plus facile de voir le supplément </td>?

non indenté (code original)

<table align="center" width="400" cellpadding="0" cellspacing="1" id="theBoxer"> 
<tr style="background: #686868;"> 
<td align="center" valign="top" width="70" height="25" style="border:1px #FFF solid;">Opret</td> 
<td align="center" valign="top" width="70" height="25" style="border:1px #FFF solid;">Opret</td> 
</td> 
</tr> 

dentelée

<table align="center" width="400" cellpadding="0" cellspacing="1" id="theBoxer"> 
    <tr style="background: #686868;"> 
     <td align="center" valign="top" width="70" height="25" style="border:1px #FFF solid;"> 
      Opret 
     </td> 
     <td align="center" valign="top" width="70" height="25" style="border:1px #FFF solid;"> 
      Opret 
     </td> 
     </td> 
    </tr> 
+0

Merci, la chose est que je ne sais pas comment faire ces espaces tout en écrivant le code, j'utilise le bloc-notes ++, donc j'ai toujours pensé que c'est si trié car d'autres programmes le font pour vous, non? – Karem

+1

habituellement d'autres programmes le font pour vous. Mais vous pouvez le faire manuellement aussi longtemps que votre clavier a une touche Espace. :-) –

+0

Ouais c'est plus agréable quand votre outil le fait pour vous, mais si ce n'est pas le cas, vous devriez le faire (pour votre propre santé mentale). Suivant est la décision espaces vs onglets :) –

Questions connexes