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

134
Views
cambiar u ocultar/mostrar enlaces después de completar la semana

Tengo 4 enlaces aquí y quiero mostrar solo un enlace (almuerzo diferente cada semana) a la vez. Luego muestra el primer almuerzo después de 4 semanas completadas. A partir del lunes.

 <div class="wrapper"> <a href="#" class="collection-item item-menu" data-id="1">Lunch Menu (Week #1)</a> <a href="#" class="collection-item item-menu" data-id="2">Lunch Menu (Week #2)</a> <a href="#" class="collection-item item-menu" data-id="3">Lunch Menu (Week #3)</a> <a href="#" class="collection-item item-menu" data-id="3">Lunch Menu (Week #4)</a> </div>

Cualquier ayuda es muy apreciada.

about 4 years ago · Juan Pablo Isaza
2 answers
Answer question

0

Descubrí una forma más sencilla de cambiar el menú del almuerzo según los números de semana

 <div class="hidden">Week Number is : <span id="week_number">0</span></div> <div class="wrapper"> <a href="#" class="d-none collection-item item-menu" id="lunch1">Lunch Menu (Week #1)</a> <a href="#" class="d-none collection-item item-menu" id="lunch2">Lunch Menu (Week #2)</a> <a href="#" class="d-none collection-item item-menu" id="lunch3">Lunch Menu (Week #3)</a> <a href="#" class="d-none collection-item item-menu" id="lunch4">Lunch Menu (Week #4)</a> </div>

css para hacer lo siguiente

 /*to hide week number div*/ .hidden { visibility: hidden; } span { color : #e91e63; } /*to hide all the lunch variants*/ .d-none { display:none; } /*to show spesific lunch variant depend on week number*/ .d-block { display:block; }

código javascript para completar la tarea

 //init date var date = new Date("2021-01-01"); document.getElementById("week_number").innerHTML =(getWeekOfMonth(date)); //get week number of date function getWeekOfMonth(date) { let adjustedDate = date.getDate()+ date.getDay(); let prefixes = ['0', '1', '2', '3', '4', '5']; return (parseInt(prefixes[0 | adjustedDate / 7])+1); } // all the lunch variants var lunch1 = document.getElementById("lunch1"); var lunch2 = document.getElementById("lunch2"); var lunch3 = document.getElementById("lunch3"); var lunch4 = document.getElementById("lunch4"); var value = document.getElementById("week_number").innerHTML; // adding css class to specific variant depending on value if(value=="1") { lunch1.classList.add("d-block"); } if(value=="2") { lunch2.classList.add("d-block"); } if(value=="3") { lunch3.classList.add("d-block"); } if(value=="4") { lunch4.classList.add("d-block"); } if(value=="5") { lunch1.classList.add("d-block"); } if(value=="6") { lunch2.classList.add("d-block"); }
about 4 years ago · Juan Pablo Isaza Report

0

hay una función que he encontrado en StackOverflow este enlace esta función le dará la cantidad de semanas en un mes y luego puede decidir habilitar qué enlace

 function weekOfTheMonth(date) { const day = date.getDate() const weekDay = date.getDay() let week = Math.ceil(day / 7) const ordinal = ['First', 'Second', 'Third', 'Fourth', 'Last'] const weekDays = ['Sunday','Monday','Tuesday','Wednesday', 'Thursday','Friday','Saturday'] // Check the next day of the week and if it' on the same month, if not, respond with "Last" const nextWeekDay = new Date(date.getTime() + (1000 * 60 * 60 * 24 * 7)) if (nextWeekDay.getMonth() !== date.getMonth()) { week = 5 } return `${ordinal[week - 1]} ${weekDays[weekDay]}` }
about 4 years ago · Juan Pablo Isaza Report
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!