علیرضا حمید
6 سال پیش توسط علیرضا حمید مطرح شد
1 پاسخ

پیشفرض قرار دادن tab ساخته شده توسط جاوا اسکریپت

سلام
پیج های مختلف سایت رو با استفاده از جاوا اسکریپت tab بندی کردم. میخوام وقتی صفحه لود بشه تب مورد نظرم لود بشه.
ولی من به مشکلی برخوردم که وقتی صفحه لود میشه تمام تب ها همزمان نمایش داده میشن. تا زمانی که روی تب مورد نظر کلیک بشه و بقیه تب ها مخفی بشن .
اگر میشه یکی کمکم کنه ؟؟؟
اینم لینک پروژه
https://github.com/alirezahamid/personal-website.git


ثبت پرسش جدید
AJ Meyghani
تخصص : |Software Engineer
@meyghania 6 سال پیش آپدیت شد
1

می تونی وقتی که صفحه load می شه همه بخش ها رو مخفی کنی و یکی رو نشون بدی:

(function($) {
  var $menutoggle = $('.menu-toggle');

  $menutoggle.on('click', function(e) {
    $('body').toggleClass('show-menu');
    $(this).toggleClass('is-active');
  });

  hideAllPages(); // اینجا
  setPageActive($('#Bio').get(0)); // اینجا
})(jQuery);

رو هم رفته اینجوری میشه:

<script>
function hideAllPages() {
  var tabcontent = document.getElementsByClassName("tabcontent");
  for (var i = 0; i < tabcontent.length; i++) {
    tabcontent[i].style.display = "none";
  }
}

function setPageActive(page) {
  page.style.display = "block";
}

function openCity(evt, cityName) {
  hideAllPages();

  // Get all elements with class="tablinks" and remove the class "active"
  var tablinks = document.getElementsByClassName("tablinks");
  for (var i = 0; i < tablinks.length; i++) {
    tablinks[i].className = tablinks[i].className.replace("active", "");
  }

  // Show the current tab, and add an "active" class to the link that opened the tab
  setPageActive(document.getElementById(cityName));
  evt.currentTarget.className += " active";
}

(function($) {
  var $menutoggle = $('.menu-toggle');

  $menutoggle.on('click', function(e) {
    $('body').toggleClass('show-menu');
    $(this).toggleClass('is-active');
  });

  hideAllPages();
  setPageActive($('#Bio').get(0));
})(jQuery);
</script>

برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام