分页:如何将长文本显示为书页


Pagination: How to display a long text as book pages?

我有一个很长的文本,我想把它作为一本书显示在一个网页上。用户将使用方向键向前和向后移动,就像翻动书页一样。

撇开页面的过渡,如何使用jQuery实现这一点?

我想的是计算将占据一页空间的文本数量,然后将整个文本分成这样的页面,然后显示它们。但这似乎是一个坏主意,占用的空间将取决于平台,即使我们修复字体。

我在使用空格计算方法时遇到的另一个问题是由于文本的css对齐显示。

以前有人为网页做过这样的事情吗?

将长字符串排版成美观的图书页面格式。你需要得到确切的字符串部分。你可以使用这个函数

function get_page($text, $page_index, $line_length=76, $page_length=40){
    $lines = explode("'n", wordwrap($texxt, $line_length, "'n"));
    $page_lines = array_slice($lines, $page_index*$page_length, $page_length);
    return implode("'n", $page_lines);
}
$line_length = 70;
$lines_per_page=50;
$page = 3;
$longtext= "...";
$page_text = get_page($longtext, $page-1, $line_length, $page_length);

看到演示。

PHP

$longtext = "..."; // it can be retrieved from sql as well.
$index=is_int($_GET['page'])? intval($_GET['page']): 1;
$line_length = 70;
$lines_per_page=50;
$longtext= "...";
$page_text = get_page($longtext, $index-1, $line_length, $page_length);
echo json_encode(array('text'=>$page_text));
JQuery

var nextPage=2;
$.get("getpage.php", { page: nextPage }, function(data){
   alert("text is "+data.text;
   // show the text data.text
});