Turn.js Chinese API to write a detailed explanation of the parameters of the page turning effect

$('.flipbook').turn(
    width: 922, 
    height: 600, 
    elevation: 50, 
    gradients: true, 
    autoCenter: true 
});

turn.js Chinese API

parameter describe Defaults

Options

acceleration Acceleration mode true or false. (must be on mobile) true
autoCenter Center flip depends on how many pages are visible true or false false
direction 翻页方向 $("#flipbook").turn({direction: "rtl"}); ltr flip from left to right
display Display mode (only display one page single, two pages double) double
duration Duration, in milliseconds. If you set it to 0, there will be no transition effect 600
gradients Show gradient shadows true
height page turn height $("flipbook").height()
pages Set the number of pages $("#flipbook").children().length
turnCorners 设置角落的值bl,br or tl,tr or bl,tr 例如:var way = 1; setInterval(function() { if (way==1) { $("#flipbook").turn("next"); if ($("#flipbook").turn("page")== $("#flipbook").turn("pages")) { way = 2; $("#flipbook").turn("options", {turnCorners: "tl,tr"}); } } else { $("#flipbook").turn("previous"); if ($("#flipbook").turn("page")==1) { way = 1; $("#flipbook").turn("options", {turnCorners: "bl,br"}); } } }, 1000); bl,br
when Listen for events when, for example: $("#flipbook").turn({when: { turning: function(event, page, pageObject) { // Implementation } } }); -

Properties Properties

animating If the page animation returns true, for example: <pre>function isAnimating() { if ($("#flipbook").turn("animating")) { alert('Animating a page!'); } }< /pre> -
direction Returns the current page flip direction: $("#flipbook").turn("direction"); -
disable Enable or disable page flipping effect: $("#flipbook").turn("disable", true);

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325216136&siteId=291194637