当我点击链接时,如何保持我的悬停效果处于活动状态?

I im currently making an menu, for an album where I want to have an hover effect that stays on as soon as I clicked on one of the album links.

I already got the class in css, it's named " .active "

<?php

$query = "SELECT album_id, album_title FROM albums WHERE fk_category_id = 1";
$result = $mysqli->query($query);

while ($row = $result->fetch_array(MYSQLI_ASSOC)) {
    $album_title = $row['album_title'];
    $album_id = $row['album_id'];

    echo "<a href='index.php?page=portfolio.php&album=$album_id'><p class='albums'>- $album_title</p></a>";

}

?>

Style:

nav ul li a:hover, nav ul li a.active {
    font-size: 20px !important;
    background-color: #2d2d2d;
    color: #b8df45;
}

I tried doing something like this, but it does not work.

if(isset($_GET['album'])){
    $album_number = $_GET['album'];

}

$query = "SELECT album_id, album_title FROM albums WHERE fk_category_id = 1";
$result = $mysqli->query($query);

while ($row = $result->fetch_array(MYSQLI_ASSOC)) {
    $album_title = $row['album_title'];
    $album_id = $row['album_id'];

    $class = "";
    if ($album_number == $row['album_id']) {
        $class = "active";
    }

    echo "<a class='$class' href='index.php?page=portfolio.php&album=$album_id'><p class='albums'>- $album_title</p></a>";

}

Specify a class to you links and then a Jquery function to add class:

Adding class "link" to links:

<?php

$query = "SELECT album_id, album_title FROM albums WHERE fk_category_id = 1";
$result = $mysqli->query($query);

while ($row = $result->fetch_array(MYSQLI_ASSOC)) {
    $album_title = $row['album_title'];
    $album_id = $row['album_id'];

    echo "<a class='links' href='index.php?page=portfolio.php&album=$album_id'><p class='albums'>- $album_title</p></a>";

}

?>

Jquery:

$(document).ready(function(){
  $(".links").click(function(){
  $(this).addClass("active");
  });
});

You can also do this inline with your code but not recommended:

 echo "<a onclick='$(this).addClass(\"active\")' href='index.php?page=portfolio.php&album=$album_id'><p class='albums'>- $album_title</p></a>";

and this is without Jquery:

<a onclick="this.setAttribute("class", "active");">

You can add a class or style to the link with javascript, when it is clicked, that gives it the proper style.

The styles are missings from your code, so I cannot work with that. But you could do something like:

echo "<a href='...' onclick=\"this.style='...';\">...</a>";

There are many other ways to do this in javascript, or with the help of JQuery.