什么是实现弹出书效果的算法

p0l*_*Boy 2 javascript

这是效果的一个例子:

http://2012.beercamp.com/

我查看了源代码,显然有一些计算旋转的算法.是否有任何此类影响的资源,或者有人可以打破并以外行的方式解释算法?

我尝试在jsfiddle.net jsfiddle中玩游戏,但没有接近它.

Sin*_*eta 5

Smashing Magazine 在该网站上完成了细分.

编辑,回复评论:adj不是"侧面",而是"长度".为了使立体书能够折叠本身,而不是只在一个烂摊子起皱,内容的背景必须在某个角度,他们坐在页.完全水平,书不起作用,完全垂直,从书的正面看不到任何东西.我们的作者从横向选择了15°,但这种选择是任意的.

一旦他选择了15°,他就需要知道这本书的宽度.这就是他所说的adj.它是通过使用固定的"场景宽度"和任意角度创建的书的大小.他使用Pythygoras定理得到它(因为数学不是他的强项),但如果你愿意,你可以用以下内容替换该行:

var adj = POPUP_WIDTH * Math.cos(degToRad(15));
Run Code Online (Sandbox Code Playgroud)