Anchor Link ke Oxygen Builder Tab

Kode JS untuk membuat anchor link komponen Tabs dari Oxygen Builder
Share:
1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...

Tambahkan class ke setiap navigasi tab button, misalkan kita mau pakai anchor #satu, maka tambahkan class tab-hash-satu, kemudian tambahkan javascript dibawah ini, kemudian coba akses dengan direct link misal ke https://digitalizer.my.id/tabs/#satu

function openOxygenTabFromHash() {
  // small delay to let Oxygen render tabs
  setTimeout(function () {
    var hash = window.location.hash.replace('#', '');
    if (!hash) return;

    // 1️⃣ Try tab button with class tab-hash-<hash>
    var btn = document.querySelector('.tab-hash-' + CSS.escape(hash));
    if (btn) {
      btn.click();
      btn.scrollIntoView({ behavior: 'smooth', block: 'start' });
      return;
    }

    // 2️⃣ Fallback: tab pane by ID
    var pane = document.getElementById(hash);
    if (!pane) return;

    var tabsWrapper = pane.closest('.oxy-tabs');
    if (!tabsWrapper) return;

    var panes = Array.from(
      tabsWrapper.querySelectorAll('.oxy-tabs-content, .oxy-tab-content, .oxy-tabs-contents > *')
    );
    var buttons = Array.from(
      tabsWrapper.querySelectorAll('.oxy-tabs-tab, .oxy-tab')
    );

    var idx = panes.indexOf(pane);
    if (idx !== -1 && buttons[idx]) {
      buttons[idx].click();
      buttons[idx].scrollIntoView({ behavior: 'smooth', block: 'start' });
    }
  }, 150);
}

// Run on page load
document.addEventListener('DOMContentLoaded', openOxygenTabFromHash);

// Run when hash changes (same page clicks)
window.addEventListener('hashchange', openOxygenTabFromHash);

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Artikel Terkait

Disable Flickity di Desktop
Javascript Merubah Kecepatan Putar Video
Jika anda ingin memperlambat pemutaran video dengan tag HTML "video", bisa menggunakan kode seperti dibawah ini:
Akordion
Kode HTML, CSS dan JS untuk membuat efek akordion
PAKET LENGKAP PEMBUATAN WEBSITE
Digitalizer menawarkan jasa pembuatan website untuk company profile, toko online, event organizer, lembaga pendidikan ataupun bidang lainnya. Anda tidak perlu memikirkan tentang domain, webhosting/server, DNS, email, desain, development, security serta masalah teknis lainnya. Cukup siapkan content website anda saja, sisanya kami yang mengerjakannya.
Semua paket pembuatan website sudah termasuk maintenance 1 tahun!
HOT LINK!
Kembali ke atas
cross