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

Henrique Melanda
Jun 4, 2017 · 2 min read

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.

E vamos salvar essa div em uma variável.

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

Agora vamos criar um variável para guardar a hora

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.

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

Confira o resultado final.


*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)

Henrique Melanda

Written by

Entusiasta pelo estudo de novas tecnologias, por projetos open source e CSS Evangelista.

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