Widget:Teste

<script> document.addEventListener("DOMContentLoaded", function() {

   var icons = document.querySelectorAll('.skills-bar .skill-icon');
   var detail = document.querySelector('.skill-detail');
   if (!icons.length || !detail) return;
   function showSkill(el) {
       detail.innerHTML =

'

' + (el.dataset.nome || ) + '

' + '

' + (el.dataset.desc || ) + '

' +

           (el.dataset.video ? '<video src="' + el.dataset.video + '" controls width="300"></video>' : ) +

(el.dataset.atr ? '

Atributos: ' + el.dataset.atr + '

' : );

   }
   icons.forEach(function(el, idx){
       el.addEventListener('click', function(){
           icons.forEach(e => e.classList.remove('active'));
           el.classList.add('active');
           showSkill(el);
       });
       if (idx === 0) showSkill(el); // Exibe a primeira já ao carregar
   });

}); </script>