css - 在悬停或单击时显示新内容

Question

我希望我的<nav>菜单在页面上显示新内容。例如，我的菜单位于页面中心下方，其中包含一个大的 .png 设计。我希望当您单击链接时，它不会加载另一个页面，而是在页面上显示新内容，并带有基本动画。就像单击链接将新内容从<nav>.

是否可以仅使用 HTML5 和 CSS 做到这一点？

Answer 1

使用 jQuery 很容易挂钩导航链接的点击事件。因此，如果您有：

<a id="navigationLink1" > Some Navigation Item </a>

您可以像这样链接点击处理程序：

$(document).ready(function() {
    var linkClickHandler = function() {
        // your code with the animation and etc
    };

    $('#navigationLink1').hover(linkClickHandler);
    $('#navigationLink1').click(linkClickHandler);
});