Main | Meniu cu marcarea link-urilor active - Forum | Registration | Login
[ New messages · Members · Forum rules · Search · RSS ]
Page 1 of 11
Forum » Tutoriale » PHP » Meniu cu marcarea link-urilor active
Meniu cu marcarea link-urilor active
BudalahDate: Wednesday, 2009-06-24, 1:01:15 AM | Message # 1
Owner
Group: Administrator
Messages: 49
Awards: 1
Reputation: 100
Status: Offline
Intr-un meniu cu foarte multe link-uri este folositor, chiar necesar, sa avem link-urile active ( link-ul paginii curente ) marcat pentru a usura navigarea in interiorul site-ului.
Acest lucru se realizeaza destul de usor cu PHP si CSS. Cu ajutorul codului php vom aplica o clasa sau un id CSS numai link-urilor care duc catre pagina curenta. Trebuie deci sa citim si sa bagam intr-o variabila numele paginii curente.
Quote
<?php $pagina = basename($_server['SCRIPT_NAME']); ?>

Voi da un exemplu. Presupunem ca aveti 4 pagini + pagina principala, toate continand meniul de navigare. Includem meniul folosind include():

Quote
<html>
<head>
<title> Pagina 1 </title>
<link rel="stylesheet" type="text/css" href="stil.css">
</head>
<body>
<?php include ('meniu.php') ?>
<p>continut pagina</p>
</body>
</html>

Toate paginile vor fi de forma celei de mai sus.
Acum sa scriem meniu.php :

Quote
/* citim numele paginii curente */
<?php $pagina = basename($_SERVER['SCRIPT_NAME']); ?>
<div id="meniu1">
<ul>
<li><a href="index.php" <?php if ($pagina == 'index.php') { ?>class="active"<?php } ?>>INDEX</a></li>
<li><a href="pag1.php" <?php if ($pagina == 'pag1.php') { ?>class="active"<?php } ?>>Pagina site 1</a></li>
<li><a href="pag2.php" <?php if ($pagina == 'pag2.php') { ?>class="active"<?php } ?>>Pagina site 2</a></li>
<li><a href="pag3.php" <?php if ($pagina == 'pag3.php') { ?>class="active"<?php } ?>>Pagina site 3</a></li>
<li><a href="pag4.php" <?php if ($pagina == 'pag4.php') { ?>class="active"<?php } ?>>Pagina site 4</a></li>
</ul>
</div>

Acolo unde numele paginii curente este identic cu adresa link-ului aplicam acelui link clasa "active". In css vom adauga elemente care sa diferentieze link-urile cu clasa "active" de cele normale, de exemplu un border sau o alta culoare a link-ului.
Iata si fisierul stil.css :

Quote
#meniu1{
padding: 0px;
width: 530px;
margin:0px auto;
position:relative;

}
#meniu1 ul {
float:none;
margin: 0px;
padding: 0px;
list-style-image: none;
list-style-type: none;
}
#meniu1 li {
float:left;
list-style-type: none;
}
#meniu1 li a {
padding: 0px;
float: left;
margin:0px 13px 0px 0px;
text-decoration:none;
border-bottom:solid, #ff0000;
background-color:#999999;
color:#000000;
}
#meniu1 li a:hover {
border-bottom:solid 5px #cc00cc;
}
#meniu1 li a.active:link, #meniu1 li a.active:visited, #meniu1 li a.active:active, #meniu1 li a.active:hover {
text-decoration: none;
border-bottom:solid 5px #990000;
}



Toată lumea vrea să meargă în Rai, dar nimeni nu vrea să moară.
 
Forum » Tutoriale » PHP » Meniu cu marcarea link-urilor active
Page 1 of 11
Search:

Statusuri & Avatare | Zeroo | Filme Noi Gratis | Cauta Stiri Online | Director Web | TopRank.ro | Games free | Siteuri | Biorezonanta | Link-ul tau aici! | Link-ul tau aici! |
Copyright Budalah © 2018

Smarty Web Director publicitate online, web design si promovare pe internet Promote your business! Web Top Gratuit Top Xchange Top-Director - Director Linkuri Pagina indexata de motorul de cautare Romanesc LinkPro - Director Web Top-Director - Director Linkuri