gusto ko sana na kapag cliniclick ko yun sa Navbar ko ay mapupunta sya dun sa page.php ko...
kaso di po napupunta po..
ito po code ko
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X_UA-Compatible" content ="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link href="../css/bootstrap.css" rel="stylesheet">
<!-- <link href="../css/style.css" rel="stylesheet"> -->
<script src="../js/bootstrap.bundle.js"></script>
</head>
<body class="m-0 border-0 bd-example m-0 border-0 ">
<!-- Example Code -->
<nav class="navbar navbar-expand-sm p-0 fixed-top " style="background:gray;">
<div class="container" id="">
<a class="navbar-brand" href="#">Navbar</a>
<button
class="navbar-toggler" style="height:25px; width:35px;"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation"
<span class="navbar-toggler-icon" style="height:10px; width:15px;"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0" name="navlist" id="">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="../user/dashboard.php">Home</a>
</li>
<li class="nav-item dropdown">
<a
class="nav-link dropdown-toggle"
href="#"
role="button"
data-bs-toggle="dropdown"
aria-expanded="false"
Tracking
</a>
<ul class="dropdown-menu" id="">
<li><a class="dropdown-item" href="#">DTS</a></li>
<li><a class="dropdown-item" href="../user/voucher.php">LDDAP_ADA</a></li>
<!-- <li><hr class="dropdown-divider" /></li>
<li>
<a class="dropdown-item" href="../user/voucher.php">LDDAP-ADA</a>
</li> -->
</ul>
</li>
<li class="nav-item" class="">
<a class="nav-link" href="../user/contact.php">Contact Us</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../user/about.php">>About</a>
</li>
</ul>
<form class="d-flex" role="search">
<input
class="form-control me-2" style="height:30px;"
type="search"
placeholder="Search"
aria-label="Search"
/>
<button class="btn btn-outline-success pt-1 me-3" style="height:30px;" type="submit">
<h6>Search</h6>
</button>
</form>
<div class="dropdown" id="idnav">
<a href="#" class="d-flex align-items-center link-body-emphasis text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
<img src="../img/eslava.jpg" alt="" width="50" height="45" class=" p-1 me-2 rounded-5">
<strong><?php echo $username; ?></strong>
</a>
<ul class="dropdown-menu text-small shadow" id="idnav">
<li><a class="dropdown-item" href="#"></a></li>
<li><a class="dropdown-item" href="#">Settings</a></li>
<li><a class="dropdown-item" href="#">Edit Profile</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="../login.php">Sign out</a></li>
</ul>
</div>
</div>
</div>
</nav >
<!-- End Nav -->
<!-- Start breadcrumb -->
<div class="pt-5 mt-3" id="brredcrumb">
<nav style="--bs-breadcrumb-divider: '>';" aria-label="breadcrumb">
<ul class="breadcrumb" id="brdcrumb">
<li class="breadcrumb-item active" aria-current="page">Home</a></li>
</ul>
</nav>
</div>
<script>
var breadcrumb = document.getElementById("brdcrumb");
var links = document.querySelectorAll("a");
for (var i = 0; i <links.length; i++){
links.addEventListener("click", function(e) {
e.preventDefault();
var currentPage = this.textContent;
var li = document.createElement("li");
li.setAttribute("class","breadcrumb-item");
li.classList.add("active");
li.setAttribute("aria-current","page");
li.innerText = currentPage;
breadcrumb.appendChild(li);
var previousElmt = li.previousElementSibling;
previousElmt.innerHTML = "<a href='#'>"+previousElmt.innerText+" </a>"
previousElmt.classList.remove("active");
previousElmt.removeAttribute("aria-current");
var nxtsblinings = [];
function sibling(){
var nxtsiblingElmt = this.nextElementSibling;
nxtsblinings.push(nxtsiblingElmt);
while (true){
if (nxtsiblingElmt.nextElementSibling == null){
break;
}else {
nxtsiblingElmt = nxtsiblingElmt.nextElementSibling;
nxtsblinings.push(nxtsiblingElmt);
}
}
for (var i=0; i<nxtsblinings.length; i++){
nxtsblinings.removeAttribute("aria-current");
nxtsblinings.classList.remove("active");
nxtsblinings.removeAttribute("class");
nxtsblinings.remove();
}
this.innerHTML = this.innerText;
this.classList.add("active");
this.setAttribute("arial-current","page");
this.removeEventListener("click",sibling);
};
previousElmt.addEventListener("click",sibling);
});
};
</script>
</body>
</html>
kaso di po napupunta po..
ito po code ko
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X_UA-Compatible" content ="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link href="../css/bootstrap.css" rel="stylesheet">
<!-- <link href="../css/style.css" rel="stylesheet"> -->
<script src="../js/bootstrap.bundle.js"></script>
</head>
<body class="m-0 border-0 bd-example m-0 border-0 ">
<!-- Example Code -->
<nav class="navbar navbar-expand-sm p-0 fixed-top " style="background:gray;">
<div class="container" id="">
<a class="navbar-brand" href="#">Navbar</a>
<button
class="navbar-toggler" style="height:25px; width:35px;"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation"
<span class="navbar-toggler-icon" style="height:10px; width:15px;"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0" name="navlist" id="">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="../user/dashboard.php">Home</a>
</li>
<li class="nav-item dropdown">
<a
class="nav-link dropdown-toggle"
href="#"
role="button"
data-bs-toggle="dropdown"
aria-expanded="false"
Tracking
</a>
<ul class="dropdown-menu" id="">
<li><a class="dropdown-item" href="#">DTS</a></li>
<li><a class="dropdown-item" href="../user/voucher.php">LDDAP_ADA</a></li>
<!-- <li><hr class="dropdown-divider" /></li>
<li>
<a class="dropdown-item" href="../user/voucher.php">LDDAP-ADA</a>
</li> -->
</ul>
</li>
<li class="nav-item" class="">
<a class="nav-link" href="../user/contact.php">Contact Us</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../user/about.php">>About</a>
</li>
</ul>
<form class="d-flex" role="search">
<input
class="form-control me-2" style="height:30px;"
type="search"
placeholder="Search"
aria-label="Search"
/>
<button class="btn btn-outline-success pt-1 me-3" style="height:30px;" type="submit">
<h6>Search</h6>
</button>
</form>
<div class="dropdown" id="idnav">
<a href="#" class="d-flex align-items-center link-body-emphasis text-decoration-none dropdown-toggle" data-bs-toggle="dropdown" aria-expanded="false">
<img src="../img/eslava.jpg" alt="" width="50" height="45" class=" p-1 me-2 rounded-5">
<strong><?php echo $username; ?></strong>
</a>
<ul class="dropdown-menu text-small shadow" id="idnav">
<li><a class="dropdown-item" href="#"></a></li>
<li><a class="dropdown-item" href="#">Settings</a></li>
<li><a class="dropdown-item" href="#">Edit Profile</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="../login.php">Sign out</a></li>
</ul>
</div>
</div>
</div>
</nav >
<!-- End Nav -->
<!-- Start breadcrumb -->
<div class="pt-5 mt-3" id="brredcrumb">
<nav style="--bs-breadcrumb-divider: '>';" aria-label="breadcrumb">
<ul class="breadcrumb" id="brdcrumb">
<li class="breadcrumb-item active" aria-current="page">Home</a></li>
</ul>
</nav>
</div>
<script>
var breadcrumb = document.getElementById("brdcrumb");
var links = document.querySelectorAll("a");
for (var i = 0; i <links.length; i++){
links.addEventListener("click", function(e) {
e.preventDefault();
var currentPage = this.textContent;
var li = document.createElement("li");
li.setAttribute("class","breadcrumb-item");
li.classList.add("active");
li.setAttribute("aria-current","page");
li.innerText = currentPage;
breadcrumb.appendChild(li);
var previousElmt = li.previousElementSibling;
previousElmt.innerHTML = "<a href='#'>"+previousElmt.innerText+" </a>"
previousElmt.classList.remove("active");
previousElmt.removeAttribute("aria-current");
var nxtsblinings = [];
function sibling(){
var nxtsiblingElmt = this.nextElementSibling;
nxtsblinings.push(nxtsiblingElmt);
while (true){
if (nxtsiblingElmt.nextElementSibling == null){
break;
}else {
nxtsiblingElmt = nxtsiblingElmt.nextElementSibling;
nxtsblinings.push(nxtsiblingElmt);
}
}
for (var i=0; i<nxtsblinings.length; i++){
nxtsblinings.removeAttribute("aria-current");
nxtsblinings.classList.remove("active");
nxtsblinings.removeAttribute("class");
nxtsblinings.remove();
}
this.innerHTML = this.innerText;
this.classList.add("active");
this.setAttribute("arial-current","page");
this.removeEventListener("click",sibling);
};
previousElmt.addEventListener("click",sibling);
});
};
</script>
</body>
</html>