0

差分 div を含む 4 つの列があり、4 番目の列はホバーです。入力バーが表示される前に、4 番目の列にマウスオーバーする必要があります。私の問題は、4 列目が非表示になっているため、1 列目のデータが 4 列目に移動することです。これで私を助けてください。これが私のコードです: http://jsfiddle.net/kerokeroppi/DYvCz/

.branch_class {
    float:left;
    width:150px;
    padding:0 5px;
    margin-top:10px;
    font-size:12px;
    font-family:"Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif;
    color:#666;
       }

.branchid_class {
    float:left;
    width:150px;
    padding:0 5px;
    margin-top:10px;
    font-size:12px;
    font-family:"Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif;
    color:#666;
    }

.balance_class {
    float:left;
    width:100px;
    padding:0 5px;
    margin-top:10px;
    font-size:12px;
    font-family:"Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif;
    color:#666; 
              }

.amount_class {
    float:left;
    width:150px;
    padding:0 5px;
    margin-top:10px;
    font-size:12px;
    font-family:"Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, Verdana, sans-serif;
    color:#666;
              }

と

 <div class="branch_class" style="margin-left:10px;">Branch Name</div>
     <div class="branchid_class" style="margin-left:0px;">Branch ID</div>
     <div class="balance_class" style="margin-left:20px;">Balance </div>
     <div class="amount_class" style="margin-left:13px;">Amount</div>
     <form id="topupform-b1" action="" onSubmit="return false">
     <div id="divamount" >
         <div id="branchname" class="branch_class" style="margin-left:7px;">Mail and More-Hermosa</div>
         <div id="branchid" class="branchid_class" style="margin-left:2px;">234</div>
         <div id="balance" class="balance_class" style="margin-left:19px;">234.289</div>
         <input type="string" name="amount" id="amount" style="margin-top:7px; margin-left:15px; background:#FFF;" />
     </div>

画像：ページにカーソルを合わせると、この写真のようになります

ホバリングしない場合は、完全に台無しにします。

4

1 に答える 1

1

jQuery . hide() メソッドを使用しているようです。hide() および show() メソッドは、css 表示プロパティを変更します。

.hide またはdisplay:none;, 非表示の要素は、非表示のときにスペースを占有しません。必要なのはvisibility:hidden;要素を非表示にすることですが、その要素は非表示になる前と同じスペースを占有します。

jQueryでこれを行いたい場合は、これを試してください：

$(selector).css('visibility', 'hidden');
$(selector).css('visibility', 'visible');
于 2012-10-19T06:21:18.057 に答える