CODEWITHSUNDEEP
javascript
Carlos Godinho
Carlos Godinho

Reputation: 1

How to randomly change urls and images with javaScript code?

I use a piece of code in Java Script to change the image and url of a floating WhatsApp contact button, alternating according to commercial and non-commercial periods. This code works well, but now it will be necessary to switch between 4 different urls in the trading period. I tried some ways to no avail, does anyone know how to fix this?

This is the current code:

    <script type="text/javascript">

  var now = new Date();
  var today = now.getDay();
  var startTime = new Date();
  startTime.setHours(08);
  startTime.setMinutes(00);
  startTime.setSeconds(00);
  var endTime = new Date();
  endTime.setHours(18);
  endTime.setMinutes(30);
  endTime.setSeconds(00);

  var comercial = '<div style="position: fixed; z-index: 1000; width: 123px; height: 140px; bottom: 15px; right: 5px;"><a href="https://wa.me/554830345599?text=Ol%C3%A1,%20quero%20saber%20mais%20sobre:%20$$title$$%20($$url$$)%0A%20*ENVIE%20PARA%20INICIAR*" target="_blank" rel="noopener noreferrer"><img class="size-medium wp-image-2986" src="https://secret.innovacestas.com.br/wp-content/uploads/2020/12/logo-whatsapp-1.png" alt="Atendimento Direto via WhatsApp" width="112" height="90" /></a>';

  var plantao = '<div style="position: fixed; z-index: 1000; width: 123px; height: 140px; bottom: 15px; right: 5px;"><a href="https://wa.me/5548996605599?text=Ol%C3%A1,%20quero%20saber%20mais%20sobre:%20$$title$$%20($$url$$)%0A%20*ENVIE%20PARA%20INICIAR*" target="_blank" rel="noopener noreferrer"><img class="size-medium wp-image-2986" src="https://secret.innovacestas.com.br/wp-content/uploads/2020/04/logo-whatsapp-png.png" alt="Atendimento Direto via WhatsApp" width="112" height="90" /></a>';


  if ((today > 0) && (today < 6) && (now > startTime) && (now < endTime))
  {document.write(comercial);}
  else
  {document.write(plantao);}

  </script>

Upvotes: 0

Views: 72

Answers (2)

Carlos Godinho
Carlos Godinho

Reputation: 1

Thanks friends for your help. I managed to solve the problem and put the solution down.

    <script type="text/javascript">

      var now = new Date();
      var today = now.getDay();
      var sec = now.getSeconds();
      var startTime = new Date();
      startTime.setHours(08);
      startTime.setMinutes(00);
      startTime.setSeconds(00);
      var endTime = new Date();
      endTime.setHours(18);
      endTime.setMinutes(30);
      endTime.setSeconds(00);

var tva = '[html code 1]';

var tvb = '[html code 2]';

var tvc = '[html code 3]';

var plantao = '[html code 4]';


if
((today > 0) && (today < 6) && (now > startTime) && (now < endTime) && (sec >= 0 && sec < 30))
{document.write(tva) }

else if
((today > 0) && (today < 6) && (now > startTime) && (now < endTime) && (sec >= 30 && sec < 45))
{document.write(tvb) }

else if
((today > 0) && (today < 6) && (now > startTime) && (now < endTime) && (sec >= 45 && sec < 60))
{document.write(tvc) }

else
{document.write(plantao) }

</script>

I used get.Seconds to work a variable from 0 to 59, so in addition to determining the alternation between the URLs and their respective images, I can control the display ratio of each one.

Upvotes: 0

Kale
Kale

Reputation: 198

You can use this so every 5 seconds you can make it do something

var delay = 5000
setInterval(() => {
    //Code to display the first object
    setTimeout(() => {
        //Code to display the second object
        setTimeout(() => {
            //Code to display the third object
            setTimeout(() => {
                //Code to display the fourth object
            }, delay*3);
        }, delay*2);
    }, delay);
}, delay*4);

Upvotes: 1

Related Questions