v2.5.2
Giriş yap

VUEJS scrollbar div içerisinde aşağıya indirmek

siyahkalem
391 defa görüntülendi

Merhaba,
Bootstrap kullanıyorum ve offcanvas modalinin içerisinde scrollbar'ın tıklandığında aşağıya inmesini istiyorum ama bir türlü olmadı.

Metoda tıkladığımda açılan offcanvas veri yüklendikten sonra otomatik aşağıya insin istiyorum, nasıl yapabilirim?

    // kodlarınız buraya eklenecek
    const el = this.$refs.scrollToMe;
            if (el) {
                el.scrollIntoView({ behavior: "smooth" });
            }
f4kor4ll
602 gün önce

Offcanvas modalinde scrollbar'ın tıklandığında aşağıya inmesini sağlamak için aşağıdaki adımları izleyebilirsiniz:

  • Offcanvas modalinin içerisindeki verilerin yüklendiğinden emin olun. Veriler yüklendikten sonra, scrollbar'ın aşağıya inmesini istediğiniz öğenin id veya ref özelliğine sahip olduğundan emin olun.

  • Offcanvas modalinin shown.bs.offcanvas etkinliği için bir dinleyici oluşturun. Bu dinleyici, offcanvas modalinin açıldığı zaman çalışacak ve scrollbar'ın aşağıya inmesini sağlayacak kodları içerecektir.

Örneğin, scrollIntoView yöntemini kullanarak belirli bir öğenin görüntülenebilir olmasını sağlayabilirsiniz. Bu yöntemi, shown.bs.offcanvas etkinliği dinleyicisi içinde kullanabilirsiniz. Örneğin:

$('#myOffcanvas').on('shown.bs.offcanvas', function () {
  var el = document.getElementById('myElement'); // myElement, scrollbar'ın aşağıya inmesini istediğiniz öğenin id'si
  if (el) {
    el.scrollIntoView({ behavior: "smooth" }); // offcanvas modalinde görünür hale getirmek istediğiniz öğenin aşağıya kaydırılması
  }
});

Yukarıdaki kodu, kendi offcanvas modalinizdeki öğelerin id özellikleriyle değiştirin ve bu kodu kullanarak scrollbar'ın tıklandığında aşağıya inmesini sağlayabilirsiniz.