Как отобразить текстовое изображение описания за 3 секунды в Dom? - PullRequest
0 голосов
/ 12 ноября 2010

Привет, я работаю на сайте.Мне нужна помощь, чтобы текст появился в div, где говорится, что любое изображение щелкнуло по названию и размеру.в сценарии DOM.Кто-нибудь может помочь?Нет innerhtml.

Спасибо

1 Ответ

1 голос
/ 12 ноября 2010

используя чистый dom-сценарий и никакой вспомогательный фреймворк, такой как jquery, нужно стереть пыль с некоторых вещей, которыми я некоторое время не пользовался!

Это сказал, что ты иди.Должен быть размещен после загрузки страницы.(Или удалите последнюю строку "showCredit ();" и поместите ее в ваше тело при загрузке.

Обратите внимание, что вам нужно изменить это, я просто поместил "источник" в текст, другие атрибуты и стилизациюзависит от вас.

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();
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...