Exibindo promoção em uma determinada hora com JS Date()

Henrique Melanda
Jun 4, 2017 · 2 min read
Image for post
Image for post

Quem trabalha com e-commerce sabe que vira e mexe tem aquelas promoções relâmpago ou por alguns dias.

Algumas plataformas tem a opção para programar a exibição de um banner e a promoção, porém para a flag de desconto não.

Ai você pensa, e agora?

E se a plataforma não tem a função de programar a exibição do banner?

Com a ajuda com Date() você pode fazer isso com javascript.

Primeiro vamos criar uma div que vai ter o texto da promoção e esconder ela no css.

<div class=”promotion”> <a href=”#”>Tudo por 50% Off</div></div>.promotion{
display: none;
}

E vamos salvar essa div em uma variável.

const promotion = document.querySelector(‘.promotion’);

Agora vamos brincar com javascript, primeiro vamos criar uma variável com o date

const now = new Date();

Agora vamos criar um variável para guardar a hora

const hours = now.getHours();

No nosso exemplo vou mostrar a div entre 9h e 12h da manhã, mais você pode fazer a exibição durante X dias com o getDate().

Confira todas as opções do Date() no site da mozilla

Agora vamos fazer um if com a condição da promoção.

if( hours >= 9 & hours ≤= 12){
}

E para finalizar vamos mostrar a div quando essa condição for verdadeira.

if( hours >= 9 & hours ≤= 12){
promotion.style.display = ‘block’
}

*Se o banner não aparecer mude a hora do if ou altere a hora da sua maquina para que a condição do if seja verdadeira.

*Essa solução pega o horário local da maquina do usuário, se estiver errado não vai funcionar direito.


Lembrando que essa não é a única solução que existe, mais resolveu meu problema quando precisei.


Obrigado por parar um tempo para ler. Se você conhece alguém que achou essa postagem útil, compartilhe e dê a esta postagem um coração verde.

8)

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch

Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore

Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store