Merhaba arkadaşlar, FlarumTR uygulamasından esinlenerek yaptığım bottom navigation barı paylaşmak istiyorum. Geliştirilebilir tabi ki :) Şuan için “soru sor” bölümü api kaynaklı olmadığı için document.selector ile butonu çekip tıklatıyoruz :) Dolayısıyla soru sor butonu sadece ana sayfa ve en yeni bölümlerinde çalışıyor. Bir de active butonu sayfa değiştiği için çok verimli çalışmıyor olabilir :) Harici Footer kısmına yazılacaklar (sorhadi.net kısmını kendi sitenize göre değiştirirsiniz) <div class="mobile-app-icon-bar" id="myDIV"> <button onclick="location.href='https://sorhadi.net'" class="buttonstyle"><i class="fa fa-home"></i> <span class="spanstyle">Ana Sayfa</span></button> <button onclick="location.href='https://sorhadi.net/?sort=newest'" class="buttonstyle"><i class="fas fa-hourglass"></i> <span class="spanstyle">En yeni</span></button> <button onclick="deneme()" class="buttonstyle"><i class="fas fa-plus-square"></i> <span class="spanstyle">Soru Sor</span></button> <button onclick="location.href='https://sorhadi.net/tags'" class="buttonstyle"><i class="fas fa-tags"></i> <span class="spanstyle">Etiketler</span></button> <button onclick="location.href='https://sorhadi.net/notifications'" class="buttonstyle"><i class="fas fa-bell"></i> <span class="spanstyle">Bildirim</span></button> </div> <script> var btnContainer = document.getElementById("myDIV"); var btns = btnContainer .getElementsByClassName("buttonstyle"); for (var i = 0; i < btns.length; i++) { btns[i].addEventListener("click", function() { var current = document.getElementsByClassName("active"); current[0].className = current[0].className.replace(" active", ""); this.className += " active"; }); } </script> <script> function deneme() { document.querySelector('.IndexPage-newDiscussion').click(); } </script> if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } Harici CSS kodları : @media(max-width: 500px) { .mobile-app-icon-bar{ display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; background: #fefefe; position: fixed; bottom: 0; width: 100%; height: 48px; z-index: 2; background: #0018ba; border: 4px solid #0077b3; } } .buttonstyle.active{ color: #002998 !important; } .buttonstyle{ width:20%; display: flex; flex-direction: column; align-items: center; background: white !important; border: none; margin-top: 4px; } .spanstyle{ font-size: 10px; margin-top: 5px; } .mobile-app-icon-bar button { padding: 0.75rem !important; cursor: pointer; } .mobile-app-icon-bar button svg, .mobile-app-icon-bar button i, .mobile-app-icon-bar button img { } @media(min-width: 800px) { .mobile-app-icon-bar{ display:none !important; } } if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); }

Alshain Bu konuyu bizimle paylaştığınız için teşekkür ederim.

Eline koluna sağlık hocam tam aradığım şeydi 🙂 🙂

Deneyecegim, cok tesekkurler 🙂

Alshain hocam elinize sağlık, sistem stabil çalışıyor mu yani bir sorun oluşturur mu bize

psdlider Bir sorun oluşturmaz hocam. https://sorhadi.net ’ten kontrol edebilirsiniz.

ANDRODC1Y1Z Hocam uzun süredir alt menü kullanmıyorum. Sorunla ilgilenmem için tekrardan aktif edip denemem lazım. Bana site adresini paylaşırsanız sizin siteniz üzerinden css ayarlarını düzenleyebilirim.

Alshain Hocam skype adresiniz varsa ordan ileteyim

Alshain Hocam sizle iletişime geçebileceğim bir yol var mı css ile ilgili bir yardıma ihtiyacım var da ?

mail atın bana ben yardımcı olayım hocam

Flarum Bottom Navigation Bar (Alt Menü)

AhmetDemir

ANDRODC1Y1Z hocam gece modunda renkler bu hali oluyor buna bi çözüm bulabilrmiyiz

sorununuz halloldu mu? Şu anda aynı sorunu ben de yaşıyorum, @Alshain yardımcı olma şansınız var mı?

Alshain

AhmetDemir Hocam çok uzun zamandır alt menüyü kullanmıyorum. O yüzden yardımcı olamayacağım maalesef.

Yönetim tarafından konu kilitlenirse sevinirim 🙂

« Önceki Sayfa