我有一些div如下。
<body>
<div class="main">
<div class="page1 active">
<p>Page1</p>
<button id="btn-about">Page2</button>
</div>
<div class="page2">
<p>Page2</p>
</div>
</div>
</body>
默认情况下,这些页面是隐藏的,除非它们具有活动类。为了显示一个新页面,我删除了 div 中具有 main 类的所有活动类,然后将活动类添加到我想要的页面,例如第 2 页。
像这样
$("#btn-about").click(
function(e) {
e.preventDefault();
$(".main div").removeClass("active");
$(".main .page-2").addClass("active");
}
);
然后它变成这样:
<div class="page2 active">
<p>Page2</p>
</div>
它工作正常,但现在我想使用 CSS3 隐藏或显示具有某些效果的页面。向上滑动、向下滑动、向左滑动、向右滑动或淡出。
我是一个关于 CSS3 的新手,希望能得到所有帮助。