Menandai Label Sedang Aktif/Di Buka Dengan JavaScript

Menandai Label Sedang Aktif/Dibuka
Menandai Label Sedang Aktif/dibuka dengan JavaScript

Menandai label yang sedang aktif bisa dilakukan dengan menambahkan kelas active pada label yang sedang dibuka. Menambahkan kelas active berdasarkan URL label atau katakan saja pada halaman label yang sedang aktif/dibuka dapat dilakukan dengan menambahkan Jquery di bawah ini. Jadi Ketika Anda sedang berada pada halaman label tertentu, maka tampilan label tersebut akan berubah sesuai dengan pengaturan tampilan label aktif yang Anda buat.

Tambahkan Jquery di atas </body> dan jangan lupa untuk mengawali dengan <script type="text/javascript"> dan diakhiri dengan </script> kurang lebih seperti ini <script type="text/javascript">Kode ...... </script>

Misalkan struktur element label pada template anda .you_wrap-sidebar .widget.Label li

$(function () {
    var path = window.location.href; // Mengambil data URL pada Address bar
    $('.you_wrap-sidebar .widget.Label li a').each(function () {
        // Jika URL pada label ini sama persis dengan path...
        if (this.href === path) {
            // Tambahkan kelas "active" pada menu ini
            $(this).addClass('active');
        }
    });
.you_wrap-sidebar .widget.Label li .active {
    padding:6px 17px 6px 10px;
    margin:0 0 0 -10px;
    color:#fc391e;
    font-size:15px;
    font-weight:bold
}
.you_wrap-sidebar .widget.Label li .active:before {
    content:"";
    width: 0;
    height: 0;
    right: 30px;
    position: absolute;
    border: 7px solid transparent;
    border-color: transparent #fc391e transparent transparent;
}
Ganti kode yang ditandai sesuai dengan struktur template anda
Reaksi :
Blok kemudian tekan tombol Ctrl dan huruf C pada keyboard secara bersamaan untuk copy artikel di atas. Bagi pengguna Google Chrome bisa menyimpan halaman ini dalam bentuk *pdf melalui tombol print/save di atas.! Bagi yang mau repost ulang harap untuk mencantumkan tautan/sumber!..

Jika Anda menyukai , Share melalui social media di atas (satu suka dari anda sangat berarti bagi kami. Tuliskan kritik dan saran anda pada form komentar di bawah! Ketikan email dan klik subcribe untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di Info [K-Moe].

Artikel relevan lainnya
Beri Komentar