繁体   English   中英

如何创建带有分页的“图片库”?

[英]How do I create a 'picture gallery' with pagination?

我希望我的网页看起来像这样: http : //1x.com/photos/latest-additions/

我几乎只使用PHP(下面找到的代码)对其进行了镜像。 但是,我决定在stackoverflow的人员告诉我需要之后,我需要一个数据库,因为从长远来看,这将是一个好习惯。 无论如何,所以现在我茫然地学习MySQL。 我想使我的页面与1x页面非常相似:以一定顺序具有可点击的图片(但为了更好的Web语义,我想使用列表而不是表格)和分页。 有人可以告诉我如何实现吗? 我不打算成为一名程序员,我只想知道如何进行布局和分页:[

有人可以帮忙吗? (通过给我一个脚本,或确切地告诉我该怎么做)

哦还有

这是我的原始代码。 您可以跳过此步骤,没有必要。

<?php
$rows_per_page = 2;
$cols_per_page = 2;
$image_href = '<a href=/';
$image_links = array('comics/randy>', 'otherstuff/randy>', 'otherstuff/randy>', 'otherstuff/randy>', 'otherstuff/randy>', 'otherstuff/randy>', 'otherstuff/randy>', 'otherstuff/randy>', 'otherstuff/randy>');
$img_srcs = '<img src="https://s3.amazonaws.com/imagetitle/';
$images = array();

for($i = 1; $i < 10; $i++)
{
    $images[$i] = $i;
}
$image_ending = '.png" height="200" width="200" /></a>';
$image_break = '<br /><div class="timeago"><div id="submitted">submitted&nbsp;</div>';
$image_descriptions = array('<abbr class="timeago" title="2011-03-13T07:24:17Z"></abbr></div>', '<abbr class="timeago" title="2011-03-13T07:24:17Z"></abbr></div>', '<abbr class="timeago" title="2011-03-13T07:24:17Z"></abbr></div>', '<abbr class="timeago" title="2011-03-13T07:24:17Z"></abbr></div>', '<abbr class="timeago" title="2011-03-13T07:24:17Z"></abbr></div>', '<abbr class="timeago" title="2011-03-13T07:24:17Z"></abbr></div>', '<abbr class="timeago" title="2011-03-13T07:24:17Z"></abbr></div>', '<abbr class="timeago" title="2011-03-13T07:24:17Z"></abbr></div>', '<abbr class="timeago" title="2011-03-13T07:24:17Z"></abbr></div>');  
$total_images = count($images);
$images_per_page = $rows_per_page * $cols_per_page;
$total_images = count($images);
$total_pages = ceil($total_images / $images_per_page);
$current_page = (int) $_GET['page'];
if($current_page<1 || $current_page>$total_pages)
{
    $current_page = 1;
}

//Get records for the current page
$page_image_links = array_splice($image_links, ($current_page-1)*$images_per_page, $images_per_page);
$page_images = array_splice($images, ($current_page-1)*$images_per_page, $images_per_page);
$page_image_descriptions = array_splice($image_descriptions, ($current_page-1)*$images_per_page, $images_per_page);
$slots = "<table border=\"0\">";
for($row=0; $row<$rows_per_page; $row++)
{
    $slots .= "<tr>";
    for($col=0; $col<$cols_per_page; $col++)
    {
        $imgIdx = ($row * $rows_per_page) + $col;
        $img = (isset($page_images[$imgIdx])) ? "{$image_href}{$page_image_links[$imgIdx]}{$img_srcs}{$page_images[$imgIdx]}{$image_ending}{$image_break}{$page_image_descriptions[$imgIdx]}" : '&nbsp;';
        $slots .= "<td class='tables'>$img</td>";
    }
    $slots .= "</tr>";
}
$slots .= "</table>";

//Create pagination links
$first = "First";
$prev  = "Prev";
$next  = "Next";
$last  = "Last";
if($current_page>1)
{
    $prevPage = $current_page - 1;
    $first = "<a href=\"w4rmoemfdoiemroifmeromfxdnxvl.php?page=1\">First</a>";
    $prev  = "<a href=\"w4rmoemfdoiemroifmeromfxdnxvl.php?page={$prevPage}\">Prev</a>";
}
if($current_page<$total_pages)
{
    $nextPage = $current_page + 1;
    $next = "<a href=\"w4rmoemfdoiemroifmeromfxdnxvl.php?page={$nextPage}\">Next</a>";
    $last = "<a href=\"w4rmoemfdoiemroifmeromfxdnxvl.php?page={$total_pages}\">Last</a>";
}

?>
<html>
<title></title>
<head><style type="text/css">
#submitted {color: #888888; font-family:Verdana, Geneva, sans-serif; font-size: .8em; float:left;}
.tables {padding-left: 20px; padding-right: 20px;}
.timeago {color: #888888; font-family:Verdana, Geneva, sans-serif; font-size: .8em; float:right;}
</style><script src="/static/jquery-1.5.1.js" type="text/javascript"></script>
<script src="/static/jquery.timeago.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
  jQuery("abbr.timeago").timeago();
});</script></head>
<body>
<h2>Here are the records for page <?php echo $current_page; ?></h2>
  <ul>
    <?php echo $slots; ?>
  </ul>
Page <?php echo $current_page; ?> of <?php echo $total_pages; ?>
<br />
<?php echo "view more: {$next}"; ?>
</body>
</html>

谢谢!

如果您绝对想要自己做这是可行的,因为这将使您学习新知识,请寻找以下资源:
1.从php连接到mysql数据库表
2.从数据库获取数据到某个变量
3.使用querystring在页面之间发送数据
4.发布并获取
对于高级内容,请了解有关发送异步调用和AJAX的信息

因为不是程序员,所以为什么要自己编写代码(甚至要求某人为您编写代码)?
有很多现成的画廊套件,例如Menalto GalleryCoppermine Galler y等。
这些代码比起您从Stackoverflow上的志愿者那里获得的一些草图更加专业。

只需下载一个即可玩。 我相信它将满足您的所有需求

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM