亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

渲染出來電子書的封面是全屏的大小,怎么可以修改那個圖片的寬高

https://img1.sycdn.imooc.com//5ba9b09b0001c91b09580650.jpg

就是這么巨大,嘗試了穿透修改圖片大小,但是不好使

正在回答

1 回答

你好,這是一個非常好的問題,要實現這一點需要使用epubjs的高級特性:css注入,因為epubjs的實現原理是iframe,而iframe中的dom不受我們的css控制,所以必須要注入css才能實現,具體做法如下:

1、在static目錄下創建一個test.css,填入以下內容:

.CoverFigure?{
??width:?100%!important;
??height:?100%!important;
}
.CoverFigure?img?{
??width:?100%!important;
??max-height:?100%!important;
}

2、在Ebook.vue的showEpub()末尾添加以下代碼:

this.rendition.hooks.render.register(view?=>?{
??const?contents?=?this.rendition.manager.getContents()[0]
??contents.addStylesheet('/static/test.css')
})

在test.css中你可以對img的大小進行控制

2 回復 有任何疑惑可以回復我~
#1

OSZZ

沒效果呀 怎么破? 老大
2019-07-20 回復 有任何疑惑可以回復我~

舉報

0/150
提交
取消
快速入門Web閱讀器開發
  • 參與學習       26493    人
  • 解答問題       228    個

帶你了解電子書閱讀器的工作原理,通過Vue.js快速實現Web閱讀器

進入課程

渲染出來電子書的封面是全屏的大小,怎么可以修改那個圖片的寬高

我要回答 關注問題
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號