mobil menü gibi bir menü yapmam lazım normal web sayfasına

09-12-2024, 15:22:28

Selamlar

bir çok eklenti denedim ama müşterimin istediği normal web sayfasında mobil menü gibi ikon ve ikona tıklayınca açılan menü için bir eklenti bulamadım yardımcı olacaklara teşekkürler

09-12-2024, 15:32:07

#2

efedev

https://www.ibtsolar.com/
bu websitedeki gibi mi istiyorsunuz hocam örnek olarak.

09-12-2024, 15:43:19

#3

scriptyazilim

evet tam istediğim gibi güzel bir menü örneği

09-12-2024, 15:46:55

#4

onuralcay

Eklenti kullanmak istemezseniz, Elementor Off Canvas özelliğiyle kendiniz de tasarlayabilirsiniz. youtube da bir çok örneği mevcut

09-12-2024, 15:48:44

#5

scriptyazilim

eklenti olsa daha kolay olurdu bir eklenti varmı bu iş için acaba bu arada çok teşekkür ederim ilginiz için

09-12-2024, 16:01:45

#6

~~ZenoHost~~

Üyeliği durduruldu

kaynak : https://www.w3schools.com/howto/howt...ile_navbar.asp

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
body {
  font-family: Arial, Helvetica, sans-serif;
}

.mobile-container {
  max-width: 480px;
  margin: auto;
  background-color: #555;
  height: 500px;
  color: white;
  border-radius: 10px;
}

.topnav {
  overflow: hidden;
  background-color: #333;
  position: relative;
}

.topnav #myLinks {
  display: none;
}

.topnav a {
  color: white;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  display: block;
}

.topnav a.icon {
  background: black;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

.topnav a:hover {
  background-color: #ddd;
  color: black;
}

.active {
  background-color: #04AA6D;
  color: white;
}
</style>
</head>
<body>

<!-- Simulate a smartphone / tablet -->
<div class="mobile-container">

<!-- Top Navigation Menu -->
<div class="topnav">
  <a href="#home" class="active">Logo</a>
  <div id="myLinks">
    <a href="#news">News</a>
    <a href="#contact">Contact</a>
    <a href="#about">About</a>
  </div>
  <a href="javascript:void(0);" class="icon" onclick="myFunction()">
    <i class="fa fa-bars"></i>
  </a>
</div>

sayfa içeriği

<!-- End smartphone / tablet look -->
</div>

<script>
function myFunction() {
  var x = document.getElementById("myLinks");
  if (x.style.display === "block") {
    x.style.display = "none";
  } else {
    x.style.display = "block";
  }
}
</script>

</body>
</html>

09-12-2024, 16:46:03

#7

mavikorku

scriptyazilim adlı üyeden alıntı: mesajı görüntüle

eklenti olsa daha kolay olurdu bir eklenti varmı bu iş için acaba bu arada çok teşekkür ederim ilginiz için

Sizin için bir eklenti yaptım konuyu actıgınız yerde dilerseniz gösterebilirim?

09-12-2024, 17:00:01

#8

mavikorku

scriptyazilim adlı üyeden alıntı: mesajı görüntüle

Selamlar

bir çok eklenti denedim ama müşterimin istediği normal web sayfasında mobil menü gibi ikon ve ikona tıklayınca açılan menü için bir eklenti bulamadım yardımcı olacaklara teşekkürler

Özelden eklenti dosyasını ilettim size.

09-12-2024, 19:58:27

#9

scriptyazilim

çok teşekkür ederim tüm arkadaşlara