Javascript script error

Asked

Viewed 62 times

0

I went to try to make a slideshow on the home page of my system, however it is giving error, because nothing happens.

Javascript:

{
satual=1;
smax=3;
stmp=3000;

function troca(){

    document.getById("e1").style.visibility="hidden";
    document.getById("e2").style.visibility="hidden";
    document.getById("e3").style.visibility="hidden";

    document.getById("e"+satual).style.visibility="visible";

    satual=satual+1;

    if(satual>smax){
        satual=1;
    }
}

function slider(){

    document.getById("e1").style.visibility="hidden";
    document.getById("e2").style.visibility="hidden";
    document.getById("e3").style.visibility="visible";

    sLiderTimer=setInterval(troca,stmp);
}

}

HTML:

<html>
<meta charset="utf-8">
<head>
    <title>Controla</title>
    <link rel="stylesheet" type="text/css" href="index.css">
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Fjalla+One" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
<script src="script.js"></script>
</head>
<body onload="slider()">

<div class="small"></div>

<div class="medium"></div>

<div class="large"></div>

<header id="cabecalho">
<div class="interface">
<img id="Logo" src="imagens/controla.png" style="width:350px; height:355px; margin-left: 51%;">
 </div>
</header>

<div class="menu">
    <ul>
        <li><a href="index.php">Página Inicial</a></li>
        <li><a href="login.php">Login</a></li>
        <li><a href="Cadastro.php">Cadastrar</a></li>
        <li><a href="#">Minha Conta</a></li>
    </ul>
</div>

<section id="banner">
    <div id="slider">
    <img id="e1" src="imagens/estoque.jpg">
    <img id="e2" src="imagens/estoque1.jpg">
    <img id="e3" src="imagens/estoque2.jpg">
    </div>
</section>

1 answer

0


The mistake is in getById. The correct is getElementById or querySelector("#id").

Complete Example:

{
  let satual = 1;
  let smax = 3;
  let stmp = 3000;

  function troca() {

    document.getElementById("e1").style.visibility = "hidden";
    document.getElementById("e2").style.visibility = "hidden";
    document.getElementById("e3").style.visibility = "hidden";

    document.getElementById("e" + satual).style.visibility = "visible";

    satual = satual + 1;

    if (satual > smax) {
      satual = 1;
    }
  }

  function slider() {

    document.getElementById("e1").style.visibility = "hidden";
    document.getElementById("e2").style.visibility = "hidden";
    document.getElementById("e3").style.visibility = "visible";

    sLiderTimer = setInterval(troca, stmp);
  }
}
<body onload="slider()">
  <section id="banner">
    <div id="slider">
      <img id="e1" src="http://placehold.it/200x100">
      <img id="e2" src="http://placehold.it/200x100">
      <img id="e3" src="http://placehold.it/200x100">
    </div>
  </section>
</body>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.