0

サンプルコード

<section id="loadGallery" style="overflow:hidden;">

<?php foreach ($this->imgs as $p)  
{ ?>
<article>
<a href="<?= $C->SITE_URL ?>pics/<?= $p->pic_id ?>">
<img src="/uploads/<?= $p->img ?>"/>
</a>
</article>
<?php }?>

<div class="more" id="<?= $p->pic_id ?>">load more</div>

</section>

記事にはfloat：left、画像の高さ：150pxがあります

最初に11個のimgをロードし、.moreがクリックされたら、最後のIDを取得して、さらにimgをロードします。.moredivを削除してから、新しい.moredivに変更します。

現在、ajaxが成功したとき、私は$（'＃loadGallery'）。append（e）;を使用しています。

問題は、.more divが画像の下になく、最後のimgの隣にあることです。

4

2 に答える 2

1

フロートがリセットされるように、フロートをクリアする要素を追加する必要があります

<div style="clear:both;"></div>
于 2012-04-20T09:34:40.947 に答える
1

.more { clear: both; }トリックを行う必要があります。クリア/スタイリングの目的で空のマークアップを使用することはお勧めしません

于 2012-04-20T09:39:58.853 に答える