Comment afficher une image texte de description pendant 3 secondes dans Dom?

Question

Bonjour, Je travaille sur un site. J'ai besoin d'aide pour faire apparaître un texte dans une div où il est dit qu'une image a cliqué sur son titre et sa taille. dans les scripts DOM. Quelqu'un peut-il aider? Pas de innerhtml.

Merci

Answer 1

en utilisant les scripts pure dom et aucun cadre d'aide comme jquery, faut dépoussiérer certaines choses que je ne l'ai pas utilisé dans un certain temps!

Cela dit ici, vous y allez. Doit être placé après le chargement de la page. (Ou supprimer la dernière ligne "showCredit();" et la mettre dans votre corps onload

Notez que vous devrez modifier cela, je viens de mettre la "source" dans le texte, d'autres attributs et le style est en hausse à vous.

function showCredit(){ 

    //find all image tags we want 
    var elements = document.getElementsByTagName('img') 

    //iterate through them 
    for(var i=0; i<elements.length;i++){ 
     //bind the onclick function to all image tags 
     elements[i].onclick=function(){ 
      //create the new div 
      var el = document.createElement('div') 

      //alter this to be whatever text you want 
      var text = document.createTextNode('Source = '+this.getAttribute('src')); 

      //alter this if you're going to have more than one clickable div 
      el.id = 'test'; 

      //add the text to the div 
      el.appendChild(text); 

      //add the new div after the image tag 
      this.parentNode.insertBefore(el, this.nextSibling); 

      //set a timer to find the element we've named "test" and remove it 
      window.setTimeout(function(){ 
       var element = document.getElementById('test'); 
       if(element){ 
        element.parentNode.removeChild(element); 
       } 
      }, 4000); 
    } 
    } 
} 

//execute the function (bind all images) 
showCredit();