Question

我在页面顶部使用了四个固定标签。当页面滚动选项卡将被更改时，它基于鼠标移动和页面高度。现在我想在页面转到顶部而不是基于鼠标移动时更改选项卡。

我的Html：

<li><a href="#tab1" id="dev" class="tab_active">Tab1</a>
 <li><a href="#tab2" id="mai">tab2</a>
 <li><a href="#tab3" id="con">Tab3</a>
 <li><a href="#tab4" id="ent">Tab4</a>

我的Javascript：

 $(document).on( "mousemove", function(event){
             var x = event.pageY;



            if ((x>0) && (x<=1499))
          {
            $("#mai").removeClass("tab_active");
            $("#con").removeClass("tab_active");
            $("#ent").removeClass("tab_active")
            $("#dev").addClass("tab_active");
            $("#tab1").removeClass("hei");
          }
          if ((x>1500) && (x<=2199))
          {
            $("#dev").removeClass("tab_active");
            $("#con").removeClass("tab_active");
            $("#ent").removeClass("tab_active")
            $("#mai").addClass("tab_active");
            $("#tab1").removeClass("hei");
            $("#he").removeClass("hei");

          }

          if ((x>2200) && (x<=2700))
          {
            $("#con").addClass("tab_active");
            $("#dev").removeClass("tab_active");
            $("#mai").removeClass("tab_active");
            $("#ent").removeClass("tab_active");
            $("#tab1").removeClass("hei");
          }

          if ((x>2800) && (x<=4000))
          {
            $("#ent").addClass("tab_active");
            $("#dev").removeClass("tab_active");
            $("#mai").removeClass("tab_active");
            $("#con").removeClass("tab_active");
            $("#tab1").removeClass("hei");
          }


    });

Answer 1

一旦您提供完整的网页代码，就可以测试，而不仅仅是 javascript ，因为我们无法为您创建网页并添加调用您的功能。

明智地获得即时答案

 $(document).on( "mousemove", function(event){
             var x = event.pageY;



            if ((x>0) && (x<=1499))
          {
            $("#mai").removeClass("tab_active");
            $("#con").removeClass("tab_active");
            $("#ent").removeClass("tab_active")
            $("#dev").addClass("tab_active");
            $("#tab1").removeClass("hei");
          }
          if ((x>1500) && (x<=2199))
          {
            $("#dev").removeClass("tab_active");
            $("#con").removeClass("tab_active");
            $("#ent").removeClass("tab_active")
            $("#mai").addClass("tab_active");
            $("#tab1").removeClass("hei");
            $("#he").removeClass("hei");

          }

          if ((x>2200) && (x<=2700))
          {
            $("#con").addClass("tab_active");
            $("#dev").removeClass("tab_active");
            $("#mai").removeClass("tab_active");
            $("#ent").removeClass("tab_active");
            $("#tab1").removeClass("hei");
          }

          if ((x>2800) && (x<=4000))
          {
            $("#ent").addClass("tab_active");
            $("#dev").removeClass("tab_active");
            $("#mai").removeClass("tab_active");
            $("#con").removeClass("tab_active");
            $("#tab1").removeClass("hei");
          }


    });

标签将根据页面高度进行更改

1 个答案: