Как я могу поместить смайлики / смайлики в чат-комнату, реализованную с использованием PHP и jQuery ajax-метода? - PullRequest
Новая
       17

Как я могу поместить смайлики / смайлики в чат-комнату, реализованную с использованием PHP и jQuery ajax-метода?

0 голосов
/ 04 января 2012

Я создал 3 страницы- mainpage.php, post.php, display.php.
. Главная страница имеет основной интерфейс чата с идентификатором div 'chatbox' и текстовое поле с кнопкой отправки.При нажатии на кнопку отправки, используйте jQuery для вызова post.php и введите сообщение пользователя в базу данных.В этом нет проблем.

Затем я использую метод jQuery ajax (см. Ниже) для вызова display.php и помещаю содержимое, возвращаемое в div чата.Вот код: 

function loadLog(){  
        if(counter>1)
                    delaytime=2500;
        counter++;
                var oldscrollHeight = $("#chatbox").attr("scrollHeight") - 20; 
        var id=$("#ID").val();
        var _url='display.php?Id='+id;
        $.ajax({  
            url:_url,
            cache: false,  
            success: function(html){  
                $("#chatbox").html(html); //Insert chat from DB into the #chatbox div       
                var newscrollHeight = $("#chatbox").attr("scrollHeight") - 20; 
                if(newscrollHeight > oldscrollHeight){  
                    $("#chatbox").animate({ scrollTop: newscrollHeight }, 'normal');  
                }  
            },  
        });  
    }

Примечание: эта функция вызывается с интервалом 2500 миллисекунд - 

setInterval (loadLog, delaytime);

Это тоже отлично работает.

Теперь,в display.php я использовал 

echo PIPHP_ReplaceSmileys($chatdisp['Msg'], 'smileys/');

для отображения смайлов внутри чата.Код для этого здесь: http://pluginphp.com/plug-in59.php

Моя проблема: поскольку мы обновляем display.php каждые 2500 миллисекунд, смайлики мигают каждый раз, когда они отображаются.Это не происходит с текстом, так как текст быстрый, а загрузка изображений занимает много времени.Это не идеально.Есть ли способ предотвратить это мигание?

1 Ответ

3 голосов
/ 04 января 2012

Попробуйте установить улыбки в качестве фона. 1 большой файл со всеми эмоциями. Он будет загружен один раз, после чего вы можете легко установить улыбку с определением класса на блок. Пример: <div class="emotion lol"></div>

...