我在將兩個元素放在容器內同一行上時出現問題。我想我最好向你展示我的意思:http://fillobottosw.altervista.org/水平對齊兩個元素
執行擴展後,右側會顯示一種說明,但不是顯示在灰色邊框內。 這是我寫下來至今:
HTML代碼
<div class="tile">
<div id="main" width="509" style="float: left;">
<img src="images/rbf.png" width="509" height="188">
</div>
<div id="second" width="509" style="float: left;">
<p class="description">...text...</p>
</div>
</div>
CSS代碼
p.description {
display: none;
color: #999;
float:right;
margin-left: 520px;
}
.tile {
border-style:solid;
border-color: #999;
border-width: 1px;
height: 188px;
width: 509px;
margin-right: auto;
margin-left: auto;
}
JAVASCRIPT(擴展)
$('.tile').hover(
function() {
$(this).filter(':not(:animated)').animate({ width: '1100px'}, 600, 'swing',
function() { $(this).find('.description').fadeIn(700);
});
},
function() {
$(this).find('.description').hide();
$(this).animate({width: '509px'}, 200);
}
);
你能告訴我我一直在做的錯誤嗎? 在此先感謝
這個。不知道這個,你的建議對我來說非常有用。無論如何,現在瓷磚下面的所有元素都消失了。 – fillobotto
我會處理它,然後我會在這裏發帖,如果我不斷收到此問題。謝謝 – fillobotto
「當你浮動元素時,它會將它們從常規的DOM流中提取出來,所以它們並不像你想象的那樣被包含在內。」也許這就是爲什麼我得到這個:http://imgur.com/bmQhHwg。要模擬它,請在我的網站上,將鼠標放在一塊瓷磚上,然後非常快地放在第二塊瓷磚上,然後再放在第一塊瓷磚上,最後將鼠標放在瓷磚外面。你必須非常快。我想現在的問題是jQuery,它太慢了...... – fillobotto