вспывающее окно

16

Mup4uk @Mup4uk

09.09.2011

Добрый вечер. Подскажите как сделать, что-бы когда пользователю в сообщении указывают время (например см. 18:27:33 ), то при наведении на это время вспывало окошко с сообщением (как на скрине), на которое указывает это время) Заранее спасибо 😀

Отредактировано Mup4uk - 09.09.2011

6600

Александр @admiral

09.09.2011

Модерация - Скрипты в чате - /* [Функция - вывода сообщений и команд] */
Найти красное:

/* Добавление граф ников, градиента и формат времени */
set_nick=setgn(cmd,nick);
set_text=setgr(cmd,nick,text);
set_time="<font style='cursor:pointer;' onclick='parent.sendto(\" см. "+time+" \");'>"+time+"</font> ";

Добавить синее:

/* Добавление граф ников, градиента и формат времени */
set_nick=setgn(cmd,nick);
set_text=setgr(cmd,nick,text);
set_time="<a href='#' title='"+time+"'><font style='cursor:pointer;' onclick='parent.sendto(\" см. "+time+" \");'>"+time+"</font></a> ";

Тут синее title='"+time+"' выводит время в подсказке то же на что и наводишь, можно за место синего свою подсказку прописать, типа: title='Кликни меня для вставки в поле отправки сообщений'

Как вариант вставки юез ссылки:

set_time="<span title='"+time+"'><font style='cursor:pointer;' onclick='parent.sendto(\" см. "+time+" \");'>"+time+"</font></span> ";

Поле для деятельности думаю понятно)

16

Mup4uk @Mup4uk

09.09.2011

Наверное Ты меня не совсем понял либо я туплю) Сейчас покажу наглядно что я хочу.
Что-бы при на наведении на время (в красном поле), появлялось синее поле, в котором было бы написано то что написано в чёрном поле, на которое указывает красное поле))
Как-то там) Сам еле понял что написал)

**********

Отредактировано Mup4uk - 09.09.2011

474

Айк @Айк

10.09.2011

посмотри ********** может поможет!

1007

BETEPAH @BETEPAH

17.10.2011

Mup4uk пишет:

Наверное Ты меня не совсем понял либо я туплю) Сейчас покажу наглядно что я хочу.
Что-бы при на наведении на время (в красном поле), появлялось синее поле, в котором было бы написано то что написано в чёрном поле, на которое указывает красное поле))
Как-то там) Сам еле понял что написал)

**********

Если устанавливали скрипт мигалки от ridz, можно его модифицировать.
1. Заменяем в приведенных скриптах (в двух местах)
<span onclick=\"parent.showdiv('"+timeremoveid+"','"+cmd+"');\">"+timeremove+"</span>
на

<span onmouseover=\"parent.showdivtext(this,'"+timeremoveid+"')\" onmouseout=\"parent.showdivtext(this,0)\" onclick=\"parent.showdiv('"+timeremoveid+"',0);\">"+timeremovez[i]+"</span>

2. Добавляем в Администрация-Модерация-Скрипты в чате- Функции - общие:

/* Показ сообщения, на которое ссылаются */

function showdivtext(where,id){

var d=parent.left.document;

var targ=d.getElementById('showremovez');

if (id==0) {

targ.style.display='none';}

var div=d.getElementById(id);

if(div) {

targ.style.display='block';

targ.style.top=getElementPosition(where).top-getElementPosition(div).height - 6 + "px";

targ.innerHTML=div.innerHTML;

}

}



/* координаты объекта getElementPosition(this).top - положение сверху элемента this, getElementPosition(this).left - положение слева элемента this, getElementPosition(this).width - ширина элемента this, getElementPosition(this).height - высота элемента this */

function getElementPosition(elem){

var w = elem.offsetWidth;

var h = elem.offsetHeight;

var l = 0;

var t = 0;

while (elem){

l += elem.offsetLeft;

t += elem.offsetTop;

elem = elem.offsetParent; }

return {"left":l, "top":t, "width": w, "height":h};

}

3. Администрация-Фреймы-Фрейм сообщений добавляем после <body...>
<div id="showremovez" class="popup" style="display:none"></div>
4. Администрация-Дизайн-Стили - добавляете оформление всплывающего блока по желанию. У меня, например, так:

.popup {

position:absolute;

background:#FFFACD;

border:1px solid #000;

padding:2px;

}

Выглядит вот так:

123

Федор @karach

17.10.2011

BETEPAH,

а для 4 версий можете выложить скорректированный полный мануал, пожалуйста

1007

BETEPAH @BETEPAH

17.10.2011

karach пишет:

BETEPAH,

а для 4 версий можете выложить скорректированный полный мануал, пожалуйста

Я, к сожалению, не знаком с построением блоков в 4й версии. Может кто-то знакомый с js, у кого 4я версия подредактирует...
Основные моменты это:
var d=parent.left.document; - должно указывать на блок с сообщениями
parent. - в функциях, скорее всего просто убрать.
функция function getElementPosition(elem) - определяет положение элемента на странице - координаты левого верхнего угла, высоту и ширину.
функция function showdivtext(where,id) - включает скрытый блок с id="showremovez" при наведении курсора на "см..." (onmouseover=\"parent.showdivtext(this,'"+timeremoveid+"')\"), помещает в него текст из нужного сообщения и выставляет его положение, смещая вверх от "см..." на высоту блока + 6пкс (это значение тоже можно подгонять по ситуации). При вынесении курсора (onmouseout=\"parent.showdivtext(this,0)\") блок снова скрывается.

В принципе, ничего особо сложного.

Отредактировано BETEPAH - 17.10.2011

248

Bab_n1k @Bab_n1k

11.01.2012

можно ли как то просто сделать, когда приходит сообщение см. 18:27:33 (время сообщения) оно в логе выделялось рамкой без использования мигалки от ridz:? Или другой вариант, при нажатии на время которое пришло "ник1:ник2: см. 18:27:33 прочитай" скрул автоматически перематовал чат к тому месту?

9260

Евгений @starkon

11.01.2012

Bab_n1k пишет:

можно ли как то просто сделать, когда приходит сообщение см. 18:27:33 (время сообщения) оно в логе выделялось рамкой без использования мигалки от ridz:? Или другой вариант, при нажатии на время которое пришло "ник1:ник2: см. 18:27:33 прочитай" скрул автоматически перематовал чат к тому месту?

У BETEPAH хорошо это реализовано, обращайся к нему, мож поделится)

415

Денис @FeNIX74

27.04.2015

И все таки как запелить это решение под новую версию?

415

Денис @FeNIX74

10.08.2015

BETEPAH пишет:

Mup4uk пишет:

Наверное Ты меня не совсем понял либо я туплю) Сейчас покажу наглядно что я хочу.
Что-бы при на наведении на время (в красном поле), появлялось синее поле, в котором было бы написано то что написано в чёрном поле, на которое указывает красное поле))
Как-то там) Сам еле понял что написал)

**********

Если устанавливали скрипт мигалки от ridz, можно его модифицировать.
1. Заменяем в приведенных скриптах (в двух местах)
<span onclick=\"parent.showdiv('"+timeremoveid+"','"+cmd+"');\">"+timeremove+"</span>
на

<span onmouseover=\"parent.showdivtext(this,'"+timeremoveid+"')\" onmouseout=\"parent.showdivtext(this,0)\" onclick=\"parent.showdiv('"+timeremoveid+"',0);\">"+timeremovez[i]+"</span>

2. Добавляем в Администрация-Модерация-Скрипты в чате- Функции - общие:

/* Показ сообщения, на которое ссылаются */

function showdivtext(where,id){

var d=parent.left.document;

var targ=d.getElementById('showremovez');

if (id==0) {

targ.style.display='none';}

var div=d.getElementById(id);

if(div) {

targ.style.display='block';

targ.style.top=getElementPosition(where).top-getElementPosition(div).height - 6 + "px";

targ.innerHTML=div.innerHTML;

}

}



/* координаты объекта getElementPosition(this).top - положение сверху элемента this, getElementPosition(this).left - положение слева элемента this, getElementPosition(this).width - ширина элемента this, getElementPosition(this).height - высота элемента this */

function getElementPosition(elem){

var w = elem.offsetWidth;

var h = elem.offsetHeight;

var l = 0;

var t = 0;

while (elem){

l += elem.offsetLeft;

t += elem.offsetTop;

elem = elem.offsetParent; }

return {"left":l, "top":t, "width": w, "height":h};

}

3. Администрация-Фреймы-Фрейм сообщений добавляем после <body...>
<div id="showremovez" class="popup" style="display:none"></div>
4. Администрация-Дизайн-Стили - добавляете оформление всплывающего блока по желанию. У меня, например, так:

.popup {

position:absolute;

background:#FFFACD;

border:1px solid #000;

padding:2px;

}

Выглядит вот так:
**********

Как отключить показ граф ников в этом окне popup

2615

Сергей @Pegass

10.08.2015

Распарсить регуляркой и заменить, готовый код есть у k4at, найдёшь админа - считай 80% решения у тебя в кармане)))

415

Денис @FeNIX74

10.08.2015

Pegass, Где же его искать.... Чата походу уже нету.. Только блог!

2970

удалён @Foggy

10.08.2015

Код всего этого чата я несколько раз копировал себе))) на такой как раз случай) и он всегда сильно отличался) он эволюционировал/революционировал отдельно от всего проекта несколько раз) жаль он не так много технологий интересных внедрял)

p.s. у меня есть код его чата, но я не дам 😋

2615

Сергей @Pegass

10.08.2015

Там была функция антиградиент, собственно только она и нужна))))

4619

Web3r @Web3r

10.08.2015

В функции граф. ника картинку обрамляем через <span>; выводим текст ника в span data-attr; пишем стиль для popup, где хайдим картинку и выводим контентом data-attr.

2970

удалён @Foggy

11.08.2015

Pegass, что за антиградиент? ничего такого там не видел. и чем оно отличается от обычного включения/отключения градиента? такого же, как с графниками.

2615

Сергей @Pegass

11.08.2015

Foggy, тем что функция брала конечный innerHTML и убирала из него градиент и графник, оставляя при этом смайлы, картинки обработанные теги)))

415

Денис @FeNIX74

08.10.2015

Как переделать данное решение чтоб вместо того когда наводишь и показывает сообщение а при нажатии на время к примеру см. 16:21:09 и выводился блок а не как сча при наведении он появляется???