Boa tarde pessoal, estou tentando dominar o uso do HTML5, e durante a tentativa de correção de erros do minha página HTML5 me encontro no erro descrito no título da página e não consigo entender do que se trata, pois entendo isso como uma declaração aberta de erro. Eis aqui o código:
<div class="under">
<section>
<div class="slides2">
<div class="bar3" id="bar3"></div>
<div class="bartxt3" id="bartxt3">
<legend>Mais Procurados</legend>
</div>
<div class="bubblebox">
<div id="bubbles">
<div onclick="bubbles(0); clearInterval(intrvl);" style="background:#999;" active></div>
<div onclick="bubbles(1); clearInterval(intrvl);" style="background:#999;"></div>
<div onclick="bubbles(2); clearInterval(intrvl);" style="background:#999;"></div>
<div onclick="bubbles(3); clearInterval(intrvl);" style="background:#999;"></div>
</div>
<hr>
<div id="bubblecontent">
<h1><span class="badge badge-secondary">Mais procurados</span></h1>
<p>Confira os produtos mais procurados na loja Plug!</p>
<script>
function _(x){return document.getElementById(x);}
// Variables for bubble array, bubble index, and the setInterval() variable
var ba, bi=0, intrvl;
// bca - Bubble Content Array. Put your content here.
var bca = [
'<h2>Galaxy S5</h2><p style="margin-left:1px;">R$0000,00</p><img src="c1.jpg" alt="test" style="margin-left:1px;" active>',
'<h2>Asus Zenfone GO</h2><p style="margin-left:1px;">R$0000,00</p><img src="c2.jpg" alt="test" style="margin-left:1px;">',
'<h2>iPhone X</h2><p style="margin-left:1px;">R$0000,00</p><img src="c3.jpg" alt="test" style="margin-left:1px;">',
'<h2>iPad 2019</h2><p style="margin-left:1px;">R$0000,00</p><img src="d2.jpg" alt="test" style="margin-left:px; width:200px;">'
];
// This function is triggered by the bubbleSlide() function below
function bubbles(bi){
// Fade-out the content
_("bubblecontent").style.opacity = 0;
// Loop over the bubbles and change all of their background color
for(var i=0; i < ba.length; i++){
ba[i].style.background = "rgba(0,0,0,.1)";
}
// Change the target bubble background to be darker than the rest
ba[bi].style.background = "#999";
// Stall the bubble and content changing for just 300ms
setTimeout(function(){
// Change the content
_("bubblecontent").innerHTML = bca[bi];
// Fade-in the content
_("bubblecontent").style.opacity = 1;
}, 300);
}
// This function is set to run every 5 seconds(5000ms)
function bubbleSlide(){
bi++; // Increment the bubble index number
// If bubble index number is equal to the amount of total bubbles
if(bi == ba.length){
bi = 0; // Reset the bubble index to 0 so it loops back at the beginning
}
// Make the bubbles() function above run
bubbles(bi);
}
// Start the application up when document is ready
window.addEventListener("load", function(){
// Get the bubbles array
ba = _("bubbles").children;
// Set the interval timing for the slideshow speed
intrvl = setInterval(bubbleSlide, 5000);
});
</script>
</div>
</div>
</section>
Reforçando que o erro acusado é sobre o section
<div>
que não estão fechadas. Normalmente o próprio Browser fecha essas divs abertas mas pode dar algum erro... Agora falando Semanticamente a sua<section>
deveria está fora da div under ou vc pode transforma-la em<article>
para ver se resolve.