twitter-bootstrap - TurnJS 和引导部分

Question

我正在尝试向我的引导 Web 应用程序添加一个部分，该应用程序将使用 turnjs 翻书。我的 HTML 代码：

  <!-- TurnJS -->
<section id="turnJS" class="turnJS">
    <div id="flipbook">
        <div class="hard"> My Turn </div>
        <div class="hard"></div>
                            <div style="background-image:url(pages/01.jpg);"></div>
                            <div style="background-image:url(pages/02.jpg);"></div>
                            <div style="background-image:url(pages/03.jpg);"></div>
                            <div style="background-image:url(pages/04.jpg);"></div>
                            <div style="background-image:url(pages/05.jpg);"></div>
                            <div style="background-image:url(pages/06.jpg);"></div>
                            <div class="hard"></div>
                            <div class="hard"></div>
                        </div>
</section>

我的 JS 代码：

$("#flipbook").turn({
width: 400,
height: 300,
autoCenter: true

});

有人有工作样本吗？

Answer 1

你有什么问题？不知道您的问题是什么...您能否更好地解释一下您自己，以便社区可以帮助您？如果您尝试将 turnjs 添加到您的站点，您只需将 div 翻书添加到具有类容器或行的 div 或部分中，就是这样！

这是一个例子：

<section id="turnJS" class="turnJS container"> <div class="row"> <div id="flipbook"> <div class="hard"> My Turn </div> <div class="hard"></div> <div style="background-image:url(pages/01.jpg);"></div> <div style="background-image:url(pages/02.jpg);"></div> <div style="background-image:url(pages/03.jpg);"></div> <div style="background-image:url(pages/04.jpg);"></div> <div style="background-image:url(pages/05.jpg);"></div> <div style="background-image:url(pages/06.jpg);"></div> <div class="hard"></div> <div class="hard"></div> </div> </div> </section>