php - 如何使弹出式目录类似于 CodeIgniter 用户指南中的目录？

Question

https://www.codeigniter.com/user_guide/tutorial/index.html

访问该链接并在页面右上角查找目录按钮。我想将其应用于我正在制作的网页。

你怎么称呼这种设计技巧？有关如何操作的教程的任何链接？非常感谢。

Answer 1

要创建该菜单，您可以使用 css 和 jquery。用

创建一个 div

position:absolute;top:-400px;width:auto;height:430px;

然后您使用 jquery 对其进行动画处理。单击时，设置 top:0px。您还可以使用动画 jquery 函数。乐:

$(document).ready(function(){
$('div a').click(function(){
$(this).parent().css('top','0px');
$(this).addClass('opened');<br/>
$(this).click(function() {
if($(this).hasClass('opened')){
$(this).parent().css('top','-280px');
}
})
});
});

<div style="width:100%;background-color:red;position:absolute;height:300px;top:-280px;"><a href="javascript:void(0)" style="width:80px;height:20px;background-color:black;bottom:0;position:absolute;"></a></div>

这是一个示例代码。从这里你可以编辑它，你可以动画它。祝你好运!