Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

308
Views
How to auto move active class before after in JavaScript

I have created simple scroll animation page, if I scroll right side want to delete previous items

then if I scroll left side want to delete next items. see this bellow image, how to solve this issues. could you please solve this issue. enter image description here

// Sticky Catergory Menu
if ($(window).scrollTop() > 400) {
  $("#stickyMenu").addClass('sticky');
} else {
  $("#stickyMenu").removeClass('sticky');
}

//get current sroll position
var scrollPosition = $(window).scrollTop();

//get the position of the containers
for (i = 0; i < span_list.length; i++) {
  if (scrollPosition >= ($("#" + span_list[i]).offset().top) - 50) {
    $("#nav" + (i + 1)).siblings().removeClass("active");
    $("#nav" + (i + 1)).addClass("active");
  }
}

// if (("div.item:visible")) {
// if ($("div.item").is(":visible")) {
//    var content = $(this).html()
//    console.log("content == " + content)
//    var row_id = $(this).parent().closest("div[id]").attr("id");
//    console.log("row_id == " + row_id)
// }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="topnav sticky" id="stickyMenu">
  <span data-id="appetizers" id="nav1" class="cat-nav">Appetizers</span>
  <span data-id="desserts" id="nav2" class="cat-nav">Desserts</span>
  <span data-id="pizza--classic-11-inches-" id="nav3" class="cat-nav active">Pizza (Classic 11 inches)</span>
  <span data-id="salad" id="nav4" class="cat-nav">Salad</span><span data-id="soups" id="nav5" class="cat-nav">Soups</span>
  <span data-id="thai-noodles" id="nav6" class="cat-nav">Thai Noodles</span>
</div>

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!