我有一个很长的文本,我想在网页中将其显示为一本书。用户将使用箭头键向前和向后移动,就像翻书一样。
撇开页面的过渡不谈,如何使用 jQuery 来实现呢?
我的想法是计算将占据一页空间的文本量,然后将整个文本分成这些页面,然后显示它们。但是,即使我们修复了字体,占用的空间也将取决于平台,这似乎是一个坏主意。
我在使用空间计算方法时面临的另一个问题是由于文本的 css 对齐显示。
以前有没有人为网页做过这样的事情?
我有一个很长的文本,我想在网页中将其显示为一本书。用户将使用箭头键向前和向后移动,就像翻书一样。
撇开页面的过渡不谈,如何使用 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
});