从 csv 文件读取图像的分页

Question

经过大量搜索，我无法找到适合我的问题的分页图片库。

我的网页显示了很多图片（无限）作为画廊。我已经应用了一些图片库插件。但是这个插件的问题是，在网页上加载太多图像需要很多时间，如果我直接转到应用了分页的最后一页，那么加载最后一页上的图像需要很多时间，因为它会加载所有图像在之前的页面上。 延迟加载在这种情况下也没有帮助。

我正在使用 csv 文件显示图像，如下所示：

<ul id="itemContainer">
            <?php
            $file_handle = fopen("gallery.csv", "r");
            while (!feof($file_handle)) {
            $lines_of_text[] = fgetcsv($file_handle, 1024);
            }
            fclose($file_handle);
            foreach ( $lines_of_text as $line): 
            ?>
            <li>
            <a href="<?php print "photos/".$line[0].".jpg"; ?>" data-lightbox="imggallery" 
            data-title="<?php print $line[0]." ".$line[1];?>">
            <img src="<?php print "photos/".$line[0].".jpg"; ?>" alt="image" style="width:140px; height:140px; border: 1px solid #00C;">
            </a>
            </li>
            <?php endforeach; ?>      
      </ul>

为了克服这个问题，我试图显示带有像 url?page=num_of_page 这样的 url 的分页图像，以便当前页面上的图像不会等待加载该页面之前的图像并更快地加载。

但我不知道在这种情况下我应该如何进行分页（比如url?page=num_of_page）？

有什么帮助吗？

Answer 1

// Open File to read
$file = fopen("gallery.csv","r");

    while(! feof($file))
    {
      // Store each line in $data
      $data[] = fgetcsv($file);
    }

    // Get Current Page
    $current_page = ($_GET['page']) ? $_GET['page'] : 1;
    // Records Per Page
    $per_page = 10;


    $start = ($current_page - 1) * ($per_page + 1);
    $offset = $per_page + 1;
    $total_pages = count($data) / $per_page;

    //Slice array according to our page
    $data = array_slice($data, $start, $per_page);

    ?>

    <ul id="itemContainer">
        <?php for($i = 0; $i < count($data); $i++) { ?>
            <li>
                <a href="<?php print "photos/".$data[$i][0].".jpg"; ?>" data-lightbox="imggallery" data-title="<?php print $data[$i][0]." ".$data[$i][1];?>">
                    <img src="<?php print "photos/".$data[$i][0].".jpg"; ?>" alt="image" style="width:140px; height:140px; border: 1px solid #00C;">
                </a> 
            </li>
        <?php } ?>      
    </ul>
    <?php
    // Show Total Pages
    for($i = 0; $i < $total_pages; $i++){
        echo '<a href="?page='.($i+1).'">'.($i+1).'</a>';
    }

希望它会起作用。

Answer 2

在@Touqeer Shafi 和PHP pagination 的帮助下终于得到了我想要的解决方案:)

这里是代码

<?php
     // Open File to read
        $file = fopen("gallery.csv","r");
        while(! feof($file))
        {
          // Store each line in $data
          $data[] = fgetcsv($file);
        }

        $limit = 20;
        $total_pages = count($data);
        $stages = 3;
        $page = (int) $_GET['page'];
        if($page){
        $start = ($page - 1) * $limit;
        }else{
        $start = 0;
        }

        //Slice array according to our page
        $data = array_slice($data, $start, $limit);

        ?>

        <ul id="itemContainer">
            <?php for($i = 0; $i < count($data); $i++) { 
            ?>
                <li>
                    <a href="<?php print "photos/".$data[$i][0].".jpg"; ?>" data-lightbox="imggallery" data-title="<?php print $data[$i][0]." ".$data[$i][1];?>">
                        <img src="<?php print "photos/".$data[$i][0].".jpg"; ?>" alt="image" style="width:140px; height:140px; border: 1px solid #00C;">
                    </a> 
                </li>
            <?php } ?>      
        </ul>
        <?php

    // Initial page num setup
    if ($page == 0){$page = 1;}
    $prev = $page - 1;
    $next = $page + 1;
    $lastpage = ceil($total_pages/$limit);
    $LastPagem1 = $lastpage - 1;

    $paginate = '';
    if($lastpage > 1)
    {

    $paginate .= "<div class='paginate'>";
    // Previous
    if ($page > 1){
    $paginate.= "<a href='?page=$prev'>previous</a>";
    }else{
    $paginate.= "<span class='disabled'>previous</span>"; }

    // Pages
    if ($lastpage < 7 + ($stages * 2)) // Not enough pages to breaking it up
    {
    for ($counter = 1; $counter <= $lastpage; $counter++)
    {
    if ($counter == $page){
    $paginate.= "<span class='current'>$counter</span>";
    }else{
    $paginate.= "<a href='?page=$counter'>$counter</a>";}
    }
    }
    elseif($lastpage > 5 + ($stages * 2)) // Enough pages to hide a few?
    {
    // Beginning only hide later pages
    if($page < 1 + ($stages * 2))
    {
    for ($counter = 1; $counter < 4 + ($stages * 2); $counter++)
    {
    if ($counter == $page){
    $paginate.= "<span class='current'>$counter</span>";
    }else{
    $paginate.= "<a href='?page=$counter'>$counter</a>";}
    }
    $paginate.= "...";
    $paginate.= "<a href='?page=$LastPagem1'>$LastPagem1</a>";
    $paginate.= "<a href='?page=$lastpage'>$lastpage</a>";
    }
    // Middle hide some front and some back
    elseif($lastpage - ($stages * 2) > $page && $page > ($stages * 2))
    {
    $paginate.= "<a href='?page=1'>1</a>";
    $paginate.= "<a href='?page=2'>2</a>";
    $paginate.= "...";
    for ($counter = $page - $stages; $counter <= $page + $stages; $counter++)
    {
    if ($counter == $page){
    $paginate.= "<span class='current'>$counter</span>";
    }else{
    $paginate.= "<a href='?page=$counter'>$counter</a>";}
    }
    $paginate.= "...";
    $paginate.= "<a href='?page=$LastPagem1'>$LastPagem1</a>";
    $paginate.= "<a href='?page=$lastpage'>$lastpage</a>";
    }
    // End only hide early pages
    else
    {
    $paginate.= "<a href='?page=1'>1</a>";
    $paginate.= "<a href='?page=2'>2</a>";
    $paginate.= "...";
    for ($counter = $lastpage - (2 + ($stages * 2)); $counter <= $lastpage; $counter++)
    {
    if ($counter == $page){
    $paginate.= "<span class='current'>$counter</span>";
    }else{
    $paginate.= "<a href='?page=$counter'>$counter</a>";}
    }
    }
    }

    // Next
    if ($page < $counter - 1){
    $paginate.= "<a href='?page=$next'>next</a>";
    }else{
    $paginate.= "<span class='disabled'>next</span>";
    }

    $paginate.= "</div>";

    }
    //echo $total_pages.' Results';
    // pagination
    echo $paginate;
        ?>