【1】高版本的jquery会导致turning的过程中page溢出半屏。
正确版本:
<script src="jquery.min.1.7.js"></script>
【2】可通过css修改翻书的底部颜色及其透明度,默认为transparent。
.flipbook .page{
background-color: /*底部色*/
}
【3】在turn.js的源文件2734行通过修改x,y的值可调整peel的大小与角度。
flipMethods._showFoldedPage.call(this,{
corner: corner,
x: point.x,
y: point.y
},
animate
);
【4】禁止touchmove虽然可以避免苹果手机页面上下滑动的问题,超过一屏距离时,通过e.preventDefault()/e.stoppropagation()来回切换,即使加了-webkit-overflow-scrolling:touch也非常影响用户体验。
目前我的解决方案是在**.page容器设置over-flow:auto/hidden**来解决超过一屏滑动。弊端是ios的页面滑动的问题还是存在。
【5】配置文件:
yepnope({
test: Modernizr.csstransforms,
yep: ['js/turn.js'],
nope: ['js/turn.html4.min.js'],
// css
both: ['css/basic.css'],
complete: loadApp
})
basic.css自己编写即可,不需使用原有的示例文件。
【6】 acceleration:true;移动端加速。