砌体不能处理从mysql获取的图像

时间:2013-09-19 11:07:24

标签: jquery mysql

我的应用程序将图像上传到文件夹中,并将其路径保存在mysql列中。我用以下方式显示这些图像..

    $sql = "SELECT * FROM task_table ORDER by RAND()";
    //ORDER BY id ASC
    $query = mysql_query($sql);
    while($row = mysql_fetch_array($query))
    {
          $file = $row['photo_name'];
          $file1 = $row['task_id'];
          $task_details=$row['task_details'];
          echo '<div id="container">
          <div id="thumbnail"><a href="uploads/'. $file .'"  title="'.cleanString($file).'" class="thickbox">
          <img src="thumbnails/thumb_'.$row['task_id'].'.jpeg" width="282" height="158" alt="image" /></a></div>
          <div id="info"><strong>' .cleanString($file).'</strong></br>
          <i>' .cleanString($task_details).'</i></div>
          </div>';
    }

这是带有'thumbnail'作为itemselector

的javascript
      <script type="text/javascript" src="js/masonry.pkgd.min.js"></script>

       <script>
       //<![CDATA[$(window).load(function()
       {
          $(function(){

          $('#container').masonry({
          itemSelector: '.thumbnail'
       });

       });
       });//]]>  
       </script>

画廊显示为通常的网格,但不像砖石。我哪里做错了?请原谅我,如果我的帖子属于错误的类别,或者我发布了一些错误,这是我在stackoverflow中的第一篇文章: - )

       <script>
         //<![CDATA[ 
         $(window).load(function(){
         $(function(){

         $('#container').masonry({
          itemSelector: '.thickbox'
          });

          });
          });//]]>  
       </script>

.....和mysql查询

          while($row = mysql_fetch_array($query))
         {
           $file = $row['photo_name'];
       $file1 = $row['task_id'];
       $task_details=$row['task_details'];
       echo '<div id="container">
       <div class="thumbnail"><div class="thickbox">
       <img src="uploads/'. $file .'" alt="image"/></div>
       <div id="info"><strong>' .cleanString($file).'</strong></br>
       <i>' .cleanString($task_details).'</i></div>
       </div>';
          }

2 个答案:

答案 0 :(得分:0)

您应该为您的DIV分配,而不是ID。看看你的itemSelector,它是'.thumbnail'。点表示它指的是“缩略图”类。

尝试将<div id="thumbnail">更改为<div class="thumbnail">

答案 1 :(得分:0)

尝试使用这个类thickbox用于div, id 在html元素中应该是唯一的更改 id&#34; container&#34;,id =&#34; thumbnail& #34; 也要上课,因为你正在遍历元素

$(function(){

          $('#container').masonry({
          itemSelector: '.thickbox'
       });

masonry itemselector