如何为每5个元素创建一个DIV?

时间:2012-04-24 04:07:29

标签: javascript html

我想为每5个元素制作一个,我有一个div。您可以在此处看到一个示例:http://www.nobregamedia.com/aa/

在底部,我有一个带有5个元素的画廊,由橙色小方块改变。每个橙色方块都有一个指向DIV名称的“链接”,例如:DIV1,DIV2,DIV3。我需要自动创建它,考虑到我从MySQL数据库中提取的项目数量。

例如:如果我拉7个项目,它会创建2个方格和2个div:DIV1和DIV2。依此类推,以5的倍数。

这是我现在的代码:

<div class="idTabs">
  <div class="col2">
    <a href="#pduno"><img class="pdimg" src="img/pduno.png" width="13" height="11" /></a>
    <a href="#pddos"><img class="pdimg" src="img/pddos.png" width="13" height="11" /></a>
    <a href="#pdtres"><img class="pdimg" src="img/pddos.png" width="13" height="11" /></a>
  </div>
</div>
<div class="row-end">&nbsp;</div>
<div class="row">
  <div class="col101">
    <div id="pduno">
      <table width="920" border="0" align="left" cellpadding="0" cellspacing="0" style="text-align:left">
        <tr>
          <td>&nbsp;</td>
        </tr>
        <tr>
          <?PHP
                            while ($retdetsfinal = mysql_fetch_row($retdest)) {
                        ?>
            <td height="110">
              <div style="width:160px; height:112px; border:2px solid #c0bdb6">
                <img src="imagenes/thumbs/<?php echo $retdetsfinal[0];?>_x.jpg" style="border:6px solid #FFF;" width="148" height="100" />
              </div>
              <br />
              <?php echo ucfirst($retdetsfinal[1]);?> -
              <?php echo ucfirst($retdetsfinal[2]);?><br />Bs.
              <?php echo $retdetsfinal[3];?>
            </td>
            <td>&nbsp;</td>
            <?PHP   
                        }
                        ?>
        </tr>
      </table>
    </div>
  </div>
</div>

1 个答案:

答案 0 :(得分:0)

查看此fiddle。虽然它可能不完全符合您的需求,当然没有样式可用,但它应该为您提供正确的提示