У меня была таблица, которая была сгенерирована из стандартного html и использовала прослушиватель событий JQuery .mouseover
, а также прослушиватель .click
. Все работало нормально. С тех пор я перешел к сбору данных из API Facebook, а затем к созданию информации на странице с помощью divs и CSS. Разбивка кода выглядит следующим образом:
Это функции jQuery:
$(document).ready(function() {
$('.fbLikeImage').mouseover(function() {
$likeID = this.id;
document.getElementById('uiFBULikeName').innerHTML = this.alt;
document.getElementById('uiFBLikeImage').innerHTML = "<img width='70' height='70' class='fbUserImage' src="+ this.src +" >";
});
$('.fbLikeImage').click(function(){
showDiv('uiCommentTextInputWrapper');
showDiv('likeButtonWrapper');
});
});
Тогда вот рендеринг HTML:
<div class="table">
<div class="tableRow">
<div class="tableCell">
<img width="50" height="50" id="192563358702" class="fbLikeImage" src="http://profile.ak.fbcdn.net/hprofile-ak-snc4/50352_192563358702_7313174_s.jpg" title="hi, friend" alt="hi, friend">
</div>
<div class="tableCell">
<img width="50" height="50" id="126279274071407" class="fbLikeImage" src="http://profile.ak.fbcdn.net/hprofile-ak-snc4/195799_126279274071407_7781147_s.jpg" title="Momentographics | Photography & Design" alt="Momentographics | Photography & Design">
</div>
</div>
</div>
Есть намного больше строк, чем это, но это основная структура.
Вот код из моего CSS:
.table{
display:table;
}
.tableRow{
display:table-row;
}
.tableCell{
display:table-cell;
vertical-align:top;
}
Это работало нормально, прежде чем я преобразовал его в формат таблицы на основе CSS. Любые идеи были бы велики, я не смог решить эту.