Turn.js（翻书效果）不起作用答案

【问题标题】：Turn.js (flipbook effect) is not workingTurn.js（翻书效果）不起作用
【发布时间】：2014-04-20 18:00:47
【问题描述】：

对不起，但我并没有得到实际犯错的地方（因为我是 javascript 的新手）。我在教程的帮助下使用 turn.js 为翻书效果编写了这段代码。但是浏览器中的输出只是显示空白屏幕。我想，一定有一个尴尬的错误，但我仍然没有得到它。请帮忙。

<html>
<head>

<script type="text/javascript" src="jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="turn.js"></script>

<style type="text/css">
    body{
        background: #9988aa;
    }
    #book{
        width: 1152px;
        height: 400px;
    }
    #book .turn-page{
        background-color: #ddd;
        background-size: 100% 100%;
    }
</style>

</head>

<body>
<div id="book">
    <div style="background-image:url('images/1.jpg');"></div>
    <div style="background-image:url('images/2.jpg');"></div>
    <div style="background-image:url('images/3.jpg');"></div>
    <div style="background-image:url('images/4.jpg');"></div>
    <div style="background-image:url('images/5.jpg');"></div>
    <div style="background-image:url('images/6.jpg');"></div>
    <div style="background-image:url('images/7.jpg');"></div>
    <div style="background-image:url('images/8.jpg');"></div>
</div>

<script type="text/javascript">

    $(window).ready(function(){
        $('#book').turn({
            display:'double',
            acceleration: true,
            elevation:50;
        });
    });

    $(window).bind('keydown',function(e){
        if (e.keyCode==37)
            $('#book').turn('previous');
        else if (e.keyCode==39)
            $('#book').turn('next');
    });

</script>


</body>


</html>

【问题讨论】：

尝试为代表页面的 div 元素添加高度。

标签： javascript jquery html

【解决方案1】：

您好，您的代码中存在小错误，请从以下行中删除分号。

elevation:50;

应该像下面这样，只是去掉分号。希望它能解决您的问题。

$(window).ready(function(){
    $('#book').turn({
        display:'double',
        acceleration: true,
        elevation:50
    });
});

$(window).bind('keydown',function(e){
    if (e.keyCode==37)
        $('#book').turn('previous');
    else if (e.keyCode==39)
        $('#book').turn('next');
});

【讨论】：

@Low-Pointer，每当您在 javascript 中使用开发人员控制台编写任何内容时，所有浏览器都有控制台，您只需打开并查看确切的问题，它总会对您有很大帮助。由于 javascript 在小错误上停止一切！