2

我正在制作包含 140 个(短)视频的 EPUB3 电子书。有一个索引文件,其中包含指向showVideo.html具有 HTML5 视频元素的单独文件的超链接。我的想法是通过查询字符串将每个视频文件名提交给showVideo.html通过javascript读取查询字符串并将值放入视频元素中。

索引文件链接:

<a href="showVideo.html?unit=E1">Click to watch E1</a>

manifest如果我将以下代码写入我的content.opf文件中,这确实有效:

<item id="vid_player" href="showVideo.html?unit=E1"
 media-type="application/xhtml+xml"/>

但如果我这样做,我必须在清单中添加 140 项。仅在清单中排除查询字符串不起作用

<item id="vid_player" href="showVideo.html" 
 media-type="application/xhtml+xml"/>

各位大神有办法解决吗?查询字符串方法只是我的想法,也许有更好的技术。

谢谢

马文

4

3 回答 3

3

为避免epubcheck's 过于挑剔的检查,您可以执行以下操作。

  1. 为元素添加一个data-video属性,如.<a><a data-video='E1'>

  2. click为相关<a>元素上的事件添加事件侦听器。

  3. 在事件处理程序中,设置location.href"showRef.html?Unit=" + elt.dataset.video或等效项。

  4. showRef.html中,解析查询字符串并做正确的事情。

于 2013-07-08T10:41:34.600 回答
1

由于您无论如何都在使用 JS 来解析视频的 ID,因此请尝试使用片段标识符而不是查询参数:<a href="showVideo.html#E1">这样您不会收到验证错误,并且您可以将 JS 中的值检索为location.hash.

于 2013-07-05T00:43:11.410 回答
1

如果您真的想为此使用 JavaScript,请尝试 Liza Daly 的建议 --- 请记住,您的 EPUB 3 电子书现在可能仅适用于 iBooks(可能是 Readium 和 Kobo 应用程序)。

如果您的唯一目的是“选择”视频,为什么不简单地为每个视频生成一个 XHTML 页面并将播放列表中的链接指向它们?毕竟,140 并不是要添加到清单中的大量元素。

或者,您可以创建一个 XHTML 页面,例如videoplayer.xhtml,使用divs(带有关联的 CSS 属性page-break-afterpage-break-before),如下所示:

<div class="videoplayer" id="video001">
 <video src="video001.mp4" ... />
</div>
<div class="videoplayer" id="video002">
 <video src="video002.mp4" ... />
</div>
...
<div class="videoplayer" id="video140">
 <video src="video140.mp4" ... />
</div>

这样您的播放列表将链接到videoplayer.xhtml#video001等。不使用 JavaScript,您更有可能在多个设备上运行。

于 2013-07-05T07:26:33.087 回答