檢測EPUB中的字體何時更改

Question

當用戶使用Javascript在電子閱讀器中更改EPUB的字體大小時，我試圖使用或創建事件監聽器，但我沒有找到方法。

我嘗試過但沒有成功的事情：

• resize事件偵聽器。
• 衡量字體大小的計時事件。
• 一個用來衡量viewport比例的聽眾。

在ebook-viewer （又稱為Caliber Viewer）中，我可以在檢查器中看到，每次更改字體大小時，控制台都會打印Viewport cfi: /2/4/2/2/1:1 。 我看到，當1:1更改時，它是某種整數比例。

這就是為什么我嘗試使用this或this檢測視口比例的原因 。

所以我想這是可能的，因為我只能看到ebook-viewer的檢查ebook-viewer ...

所有嘗試也無法在iOS上運行。

更新

我知道epubReadingSystem及其局限性。 同樣，對於EPUB3，JS是可選的。 我要解決的是在西班牙詩歌中，當一首詩的大小大於盒子的大小時，它必須是一個斷點，並且下一行必須與方括號正確對齊：

A short verse. A very very long [verse.

我想出了如何進行此更改。 問題是，當用戶更改字體時，必須再次進行計算。 我嘗試通過固定的EPUB解決此問題，但iBooks和ebook-viewer允許字體增加...

一個工作示例：jsfiddle.net/dxr9azy7

Answer 1

沒有可靠的方式來做您想要的事情，其中​​“可靠”表示“在任何可能的EPUB讀取系統上工作”。 原因是EPUB規范沒有為文檔提供一種“知道”上下文屬性的正式方法，例如，呈現該屬性的應用程序的當前閱讀設置（如字體大小）。

請注意，EPUB 2中沒有Javascript支持，而EPUB 3中只有Java語言支持，並且許多閱讀系統都限制了EPUB內部可以包含的Javascript代碼類型。

EPUB 3規范為那些支持Javascript的閱讀系統引入了一個epubReadingSystem對象，但是它不需要提供例如事件綁定，EPUB內的JS代碼可以使用該事件綁定來對例如閱讀設置中的更改做出反應。 （請參閱： http : //www.idpf.org/epub/31/spec/epub-contentdocs.html#app-epubReadingSystem ）

另一方面，由於大多數閱讀系統的確是基於WebKit之類的渲染引擎構建的，因此，如果它們允許您運行Javascript，那么您確實可以進行一些“逆向工程”，並嘗試獲取它們維護的正確全局對象和文檔。用於顯示的模型。 幸運的是，您也許可以注冊自己的綁定。 但是，此解決方案需要花費大量時間才能解決，它只能在您測試的給定閱讀系統上運行，並且可能會隨着應用程序更新而中斷。 簡而言之，我不建議您嘗試此路線。

編輯：順便說一句，您要問的是類似於我在自己的EPUB 3閱讀應用程序中實現的內容： https : //www.readbeyond.it/minstrel/developers.html#js，但不幸的是，它是唯一的應用程序（我知道）實現了一種機制，該機制在EPUB文件內的JS與閱讀系統之間建立了通信通道。

Answer 2

多虧了這篇文章，我們找到了一種方法，至少可以在Mac和iOS的Calibre，ADE和iBooks中檢測EPUB中的字體大小變化 。 最好在Readium和EPUBReader中嘗試一下...

您必須創建一個iframe：

window.addEventListener("load", function () {
    iframe = document.createElement("iframe");
    iframe.id = "some_id";
    iframe.style.top = "0";
    iframe.style.left = "0";
    iframe.style.width = "100%";
    iframe.style.height = "5em";
    iframe.style.zIndex = "-1";
    iframe.style.visibility = "hidden";

    document.body.insertBefore(iframe, document.body.childNodes[0]);

    window.frames["some_id"].addEventListener("resize", function () {
        // Event when font size changes.
    });
});

如果您正在尋找適合西班牙詩歌的腳本， 請參閱this 。 下載示例： mobileread.com/forums/attachment.php?attachmentid=155891&d=1490939383 。

謝謝！