Mobil Sitede Navbar kısmından nasıl yönlendirme yaparım?

[Ali Eren Ekinci]

Web sitesi geliştirirken ufak bir kaç sorun fark ettim ve düzeltemedim.
Aşağıdaki kodları incelerseniz hangi linklerde yönlendirme yapamadığımı göreceksiniz. Tam anlayabilmeniz için kodları ve videoyu inceleyebilirsiniz.

    <div class="col-12 col-md-12 main-menu">
      <nav class="site-navigation position-relative text-center" role="navigation">

        <ul class="site-menu main-menu js-clone-nav mr-auto d-none d-lg-block" style="padding-inline-start:0px;">


          <li><a href="index.php" class="nav-link">Ben</a></li>
          <li><a href="#dahafazlaben" class="nav-link">Biraz Daha Ben</a></li>
          <li><a href="#cozumler" class="nav-link">Çözümlerim</a></li>
          <li><a href="#nearshots" class="nav-link">@nearshots</a></li>
          <li><a href="#iletisim" class="nav-link">İletisim</a></li>
          <li><a href="index.php?do=blog" class="nav-link">Blog</a></li><!-- Bu link çalışmıyor!!!!-->
        </ul>
      </nav>
    </div>

hata.mp4

 

[Genzo W.]

siteyi tam şekilde görebilirsek daha iyi yardımcı olabiliriz.

 

[chnkyn]

a linklerinde başına # bırakılan linkler sayfa içi yönlendirmede kullanılır.örneğin içindekiler tablosunda 1.bölüm, 2.bölüm gibi listede tıklanıldığında o bölüme gitmesini yani sayfayı aşağı kaydırmayı amaçlamakta kullanılır.

<a href="#cozumler"> gibi bir kullanımda bu linke tıklarsan , sayfada id'si cozumler olan elemana scroll olayı gerçekleşir.sayfada bu id ye sahip eleman yok ise bir şey gerçekleşmez.
<a href="index.php"> şeklinde kullanıldığında ise diğer bir sayfaya yönlendirme yapılır.

 

[Ali Eren Ekinci]

alierenekinci — Back-end Dev. bu linkten ulaşabilirsiniz.

Mesaj otomatik birleştirildi: 11 Eylül 2019

a linklerinde başına # bırakılan linkler sayfa içi yönlendirmede kullanılır.örneğin içindekiler tablosunda 1.bölüm, 2.bölüm gibi listede tıklanıldığında o bölüme gitmesini yani sayfayı aşağı kaydırmayı amaçlamakta kullanılır.

<a href="#cozumler"> gibi bir kullanımda bu linke tıklarsan , sayfada id'si cozumler olan elemana scroll olayı gerçekleşir.sayfada bu id ye sahip eleman yok ise bir şey gerçekleşmez.
<a href="index.php"> şeklinde kullanıldığında ise diğer bir sayfaya yönlendirme yapılır.

Evet söylediğiniz doğru ama malesef mobil sitede linkler çalışmıyor.

 

[Genzo W.]

ilk sorununu id'lere padding top vererek çözebilirsin ama ara boşluklar fazla artmaması için navbarı biraz daratlmalısın çok geniş duruyor logonun üstünde gereksiz boşluklar var daha sonra id'lere padding vererek ayarlayabilirsin.

örnek: <div class="site-section bg-light" id="dahafazlaben" style="padding-top: 220px;">

Mesaj otomatik birleştirildi: 11 Eylül 2019

ikinci sorun ise main js dosyasında klon alırken hata var <ul class="site-nav-wrap" style="padding-inline-start:0px;"> buradaki site-nav-wrap classını silersen fark edeceksin.

Mesaj otomatik birleştirildi: 11 Eylül 2019

ikinci sorun ise main js dosyasında klon alırken hata var <ul class="site-nav-wrap" style="padding-inline-start:0px;"> buradaki site-nav-wrap classını silersen çalıştığını fark edeceksin.