Question

我有一个我希望隐藏在页面加载上的部分，只显示是否选中了某个标签，或者某人是否来自某个链接。

我已经弄明白是什么导致了我的问题。当有人来自链接时，我正在显示该部分 - service-display-box。

//Showing Service Section from Link
    $(function(){

        //get the section name from hash
        var sectionName = window.location.hash.slice(1);

        //then show the section
         $('#service-display-box').show();
         $(window.location.hash).show().scroll().siblings().hide();
    })

我想到了一种在不显示该部分的情况下加载页面的方法，但现在该部分在来自链接时不会出现。

这就是我所做的：

//Showing Service Section from Link
$(function(){

    //get the section name from hash
    var sectionName = window.location.hash.slice(1);

    if (sectionName > 1) { //added
    //then show the section
     $('#service-display-box').show();
     $(window.location.hash).show().scroll().siblings().hide();
    } else { //added
        $('#service-display-box').hide(); //added
    } //added
})

如果有人来自链接而非正常页面加载，我该如何制作此节目？

点击任何一个链接，当你到达新页面时，你会看到service-display-box没有显示出什么（这是由于我上面的更新代码 - 使用if语句）。我希望在来自特定链接时显示该部分，否则我希望该部分保持隐藏，除非选择了其中一个选项卡。

如果您有任何疑问，请与我们联系。

<div id="service-display-box">
      <div id="service-display-box-container">
        <div class="service-item-box" id="service1">
          <div class="service-item-title">DEMOLITION</div>
        </div>
        <div class="service-item-box" id="service2">
          <div class="service-item-title">ENVIRONMENTAL SOLUTIONS</div>
        </div>
        <div class="service-item-box" id="service3">
          <div class="service-item-title">CONCRETE CRUSHING</div>
        </div>
        <div class="service-item-box" id="service4">
          <div class="service-item-title">ASSET RECOVERY</div>
        </div>
        <div class="service-item-box" id="service5">
          <div class="service-item-title">SCRAP METAL RECYCLING</div>
        </div>
        <div class="service-item-box" id="service6">
          <div class="service-item-title">FOUNDATION REMOVAL</div>
        </div>
        <div id="service-top">Back to all services</div>
      </div>
    </div>


#service-display-box {
  margin: 50px 0;
  display: none;
}

//For tabs to stay active
$('.service-tab-block').click(function() {
    $('.service-tab-block').css({"background":"purple" , "color" : "#000"});
    $(this).css({"background":"#000", "color":"#FFF"});

    //To get the service display box to show
    var item_number = $(this).attr('id').replace('service_tab', '');
    $('#service-display-box').show();
     $('html, body').animate({
    scrollTop: $("#service-display-box").offset().top
  }, 1500);
    $('#service'+item_number).show().siblings().hide();
    $('#service-top').show();
});

//To go back up to Service options
$("#service-top").click(function() {
  $('html, body').animate({
    scrollTop: $("#service-tabs").offset().top
  }, 1000);
});

//Showing Service Section from Link
$(function(){

    //get the section name from hash
    var sectionName = window.location.hash.slice(1);

    //then show the section
     $('#service-display-box').show();
     $(window.location.hash).show().scroll().siblings().hide();
})

获取显示/隐藏内容的问题

0 个答案: