"Задържане" на hover

[peiN]

Здравейте, направил съм hover ефект, но е само при onmouse, а аз искам, когато си на съответната страница да има hover на съответния линк.

 

[kikity_94]

Това се нарича active не hover, но както и да е.
Има 2 вариянта.
Вариант 1: ако менюто ти е инклуднато във всяка страница и според страницата си правиш activa.
Вариянт 2: чрез php(както аз съм направил за мой проект по който работя). Взимаш линка и си го explodе-ваш

 

[peiN]

Можеш ли да ми дадеш пример с explode?

 

[IvanAdamov]

Ако сайтът ти не е голям (2-3-4-5) html документа, просто си направи отделен клас като:

<a class="active-button">Линк</a>

И във всяка страница си го слагаш на определения линк.

 

[proba]

А ако варианта на @IvanAdamov не е твоят, т.е. примерно имаш страници от видът на site.com/index.php?page=home , site.com/index.php?page=page2 , site.com/index.php?page=page3 и т.н.
То тогава ти препоръчвам този вариант (който и аз използвам де)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>web-tourist: demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
a.menu-button
{
color: #3399FF;
font-weight: bold;
}

a.menu-button:hover
{
color: #3399FF;
font-weight: bold;
text-decoration: none;
}

a.menu-active-button
{
color: #3399FF;
font-weight: bold;
text-decoration: none;
}

a.menu-active-button:hover
{
color: #3399FF;
font-weight: bold;
text-decoration: none;
}
</style>
</head>
<body>
<?php
$page = htmlspecialchars($_GET['page']);
if ($page == "home")
{
$home = 'menu-active-button';
$page2 = 'menu-button';
$page3 = 'menu-button';
}
elseif ($page == "page2")
{
$home = 'menu-button';
$page2 = 'menu-active-button';
$page3 = 'menu-button';
}
elseif ($page == "page3")
{
$home = 'menu-button';
$page2 = 'menu-button';
$page3 = 'menu-active-button';
}
else
{
$home = 'menu-active-button';
$page2 = 'menu-button';
$page3 = 'menu-button';
}
?>
<a href="?page=home" class="<?php echo $home; ?>">Home</a><br />
<a href="?page=page2" class="<?php echo $page2; ?>">Page 2</a><br />
<a href="?page=page3" class="<?php echo $page3; ?>">Page 3</a><br />
</body>
</html>

Така според различната страница, различен линк ще бъде с клас active-button, като съответно ще го замениш с името на класът ти който да е автоматично hover-нат.
Аз съм ти дал пример с примерен CSS при който избраният линк е без text-decoration, а другите са със, но hover ефекта им е премахването на text-decoration.

 

[peiN]

Благодаря, proba !

 

[tedo96]

Виж как го бях направил аз преди време като си прасках процедурен код. Мисля, че е по-добър вариант от този на колегата @proba.

                    <li <?php if ($_SERVER["PHP_SELF"] == '/index.php') {
            echo "class='open'";
        } ?>><a href="<?php dirs('index.php'); ?>">НАЧАЛО</a></li>
                    <li <?php if (strstr($_SERVER["PHP_SELF"], "tutorials")) {
            echo "class='open'";
        } ?>><a href="<?php dirs('tutorials.php'); ?>">УРОЦИ</a></li>
                    <li <?php if (strstr($_SERVER["PHP_SELF"], "forum")) {
            echo "class='open'";
        } ?>><a href="<?php dirs('forum'); ?>">ФОРУМ</a></li>
                    <li <?php if (strstr($_SERVER["PHP_SELF"], "books")) {
            echo "class='open'";
        } ?>><a href="<?php dirs('books.php'); ?>">КНИГИ</a></li>
                    <li <?php if (strstr($_SERVER["PHP_SELF"], "team")) {
            echo "class='open'";
        } ?>><a href="<?php dirs('team.php'); ?>">ЕКИП</a></li>
                    <li <?php if (strstr($_SERVER["PHP_SELF"], "contacts")) {
            echo "class='open'";
        } ?>><a href="<?php dirs('contacts.php'); ?>">КОНТАКТИ</a></li>

Сега като го гледам е много по добре да се направи с else if