gpt4 book ai didi

javascript - jQuery 同时显示一个 div 并隐藏另一个 div。目的是浏览 5 div 的

转载 作者:行者123 更新时间:2023-11-28 09:09:24 25 4
gpt4 key购买 nike

假设有一本书,其中有多个章节(比如 5 章)。完整的书呈现在一个 html 页面中,其中包含所有 5 章。每个 Chapter 都是一些 html 内容,并且存在于一个 div 中,其类名称为 Chapter。您可以为五个带有标签的页面中的每个页面采用任何虚拟 HTML 内容作为第 1 章、第 2 章......和第 5 章。

现在,当页面打开时,第一章会显示给用户。标题中有第一章。单章大于窗口的高度,因此用户可以滚动阅读本章。但是,一旦用户到达章节末尾,用户就无法看到或滚动到下一章。

当用户读完章节时,他会在右下角看到一个按钮,显示转到下一章。Imp:- 该按钮不能是章节 HTML 的一部分,它必须通过 js 在章节末尾以编程方式生成。

当用户单击此按钮时,下一章(本例中为第 2 章)应自动从底部向上滚动,直到顶部将第一页推出窗口。因此,通过插入上面的第 1 章,整个屏幕应该被动画显示的第 2 章覆盖。

因此在给定时间用户只能通过向上或向下滚动看到一章。他必须单击按钮才能访问下一章或上一章。

与第 2 章类似,页面顶部会有一个按钮可转到第 1 章,其中第 1 章将从顶部将第 2 章完全推到窗口之外。对于第 2 章,页面底部还会有一个按钮,单击该按钮,用户将以类似的动画格式转到第 3 章。

这是用户在阅读书籍时进行的一种交互。

最佳答案

你不需要编写很多代码。尝试 jquery Accordion 插件 http://jqueryui.com/accordion/

关于javascript - jQuery 同时显示一个 div 并隐藏另一个 div。目的是浏览 5 div 的,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16514493/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com