Единый форум поддержки

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Единый форум поддержки » Новые возможности форумов » Выпадающая Табличка по клику на иконку в профиле топика:


Выпадающая Табличка по клику на иконку в профиле топика:

Сообщений 321 страница 340 из 553

1

Your mafiosi написал(а):

Здравствуйте.
Я хотела бы "запросить" скрипт вот такого плана:

Зарисовки

http://sa.uploads.ru/t/mRNfh.png

● Кружочки с цифрами - скрытия инфы под профилем
● Нажимаем на стрелочку и выпадает вон-та штука.
● Нажимаем - пропадает.
● Желательно, что бы рамки выпадающей таблички были сменимы.
● Каждый контент - поле профиля.

Свернутый текст

Your mafiosi,
1. Ссылку на форум или тестовик куда будет происходить установка  (с уже установленным скриптом с кружочками на скриншоте...)
2. Вы хотите задействовать 4-ре доп поля в этой таблице - у Вас останется только одно - этого не мало ?
3.


Итоговый Скрипт:

Для Ролевых форумов

Всплывающая табличка в топике с дополнительными данными юзера
(это могут быть свои собственные медали, подарки,анкета, расширенные сведения о Персонаже)
http://sa.uploads.ru/KG3PY.png

Скрипт устанавливается в HTML низ, ближе к концу.
Настройки скрипта вынесены с пояснениями, красным в скрипте - ссылка на иконку в минипрофиле (если нужно - меняем на свою) и ID форума с темами для табличек(см описание ниже):

Код установки:

<!-- Всплывающая таблица с вкладками, в топике, с инфой о персонаже -->
<style type="text/css">
/*Подвижка иконки*/
img.a-info{
  margin-top: -3px!important;
  margin-left: 173px!important;
  width:30px;  /*Размер иконки*/
}
/*Подвижка всплывающей подсказки иконки*/
.tipsy.a-info{
  margin-top: -2px!important;
  margin-left:-6px!important;
  font: normal normal 400 11px/16.5px Verdana;
}
/*сдвиг таблицы*/ .my-tabs{
  margin-top: -73px;  /*сдвиг таблицы вверх от положения иконки*/
  margin-left:255px;  /*сдвиг таблицы вправо от положения иконки*/
}
/*Цвет фона и бордюров таблицы*/
.my-tabs>.tab-a,.my-tabs>span{
  background:#F7F6D2!important;
  border-color: #909D7E!important;
}
</style>

<link rel="stylesheet" type="text/css" href="http://forumstatic.ru/files/0013/44/56/73823.css" />
<script img-data="
http://sa.uploads.ru/SoT3N.png" src="http://forumstatic.ru/files/0013/44/56/57946.js" forum="16"></script>
<!--//End//Всплывающая таблица с вкладками, в топике, с инфой о персонаже// -->

Пояснения:

1. Создайте отдельный форум(раздел) для тем с доп. инфой конкретного юзера во всплывающей табличке. Форум открываем на чтение всем группам(можно скрыть для гостя, хотя и гостю интересно видеть табличку). Форум скрываем с "Главной" скриптом, устанавливаемым в Описание к Форуму - Администрирование- Форумы - нужный форум - редактировать
в Описание к форуму:

<!-- Скрытие форума от юзеров -->
<script id="ThisForum">if(GroupID>2){a=$('#ThisForum');a.parents('tr').hide();a.remove()}</script>

Каждая тема, - для создания таблички конкретному юзеру.
Каждый пост этой темы, начиная с первого - будет вкладкой таблицы, если:
Если он начинается с названия вкладки, вписанное в самое начало сообщение BB-тегом [mark] (маркирующий текст, см расширение под иконкой "треугольничек")
Со следующей строки такого сообщения - идёт наш контент вкладки(одним из таких сообщений может быть и отлаженная игровая анкета пользователя).
Сообщения-Вкладки должны идти друг за другом, начиная с первого поста (первым постом считается тот, который Вы заполняли при создании темы, который отображается на странице под номером 1), кол-во вкладок будет равно колву заголовков в тегах [mark], после нахождения сообщения без тега [mark]  в первой строке, скрипт считает, что вкладки исчерпаны. Скриншот темы и организации первых двух сообщений для вкладок http://sa.uploads.ru/zJNet.png
Т.е. кол-во вкладок и названия в принципе могут быть разные для каждого юзера. Успели набить один-два поста - будут одна или две вкладки.
Максимальное кол-во вкладок наверно - 6, если названия не сильно длинные.

Как устанавливается табличка для конкретного юзера:
2. В любое доп. поле профиля текущего юзера, где разрешён HTML суём ссылку на тему с вкладками таблицы таким кодом:
<a href=#tid=198></a>
!Внутрь этой(якобы) ссылки ничего и никогда не вставляем!!
Где красная цифра 198 - ID темы будущей таблички для текущео юзера.
Определяется при клике на тему в форуме с темами для табличек:
Пример для этой темы, кликаем в форуме "Сведения о участниках" тему "Ник: Волна" смотрим ссылку в адресном окне браузера:
http://timelife.0pk.ru/viewtopic.php?id=198
Цифры после = и есть ID темы, которые и вставляем в ссылку(ссылка юзерам не видна и не портит доп поля профиля, в котором разрешено HTML.

3. Добавлена очистка тем и сообщений этого форума с доп. данными пользователя при использовании поиска, для этого в скрипте добавлен атрибут forum="16", где красным = ID форума, получаемое аналогично ID темы, при клике на форум с главной, считываем в адресном окне браузера:
Пример по клику текущего форума со скриптами:
http://forum.mybb.ru/viewforum.php?id=16
И вставляем в атрибут скрипта forum= вместо красного, - свою цифру.

На вопрос: Как задать шрифт и стиль текста на вкладке:

Оформление вкладок(шрифт и т.д.) таблицы соответствует оформлению в самих сообщениях. Используйте BB-коды в форме ответа


Добавлено 22.01.2015:
Добавлен автоскролл таблички к верхней части экрана и автоскролл во вкладках таблицы при превышении высоты экрана

У поста с таблицей есть собственный селектор: .post.tableAdd


Вариант размещения кликабельной кнопки:
http://mex.su/o3H4v#p42 (жать на "Информация о персонаже")


Если у Вас фон полотна форума стоит на HTML то при всплывании таблицы может появится сдвиг тела форума
Лекарство:
Запихиваем перед тегом </style> такое указание:
body{padding-right:0!important;}


Тут попросили ставить свою собственную иконку в Доп.поле профиля, в удобное юзерам место, не заморачиваясь с позиционированием дефолтной иконки:
Вариант:
Вставляем нужную Вам иконку куда вам надо, скрываем текущую и переадресуем клик на скрытую иконку

Ставим картинку в нужное поле

<img src="Ссылка на Вашу иконку" onclick="iconRedir(this)">

В  HTML низ(Ниже скрипта)

<!-- Переадресация клика со своей Иконки для Вспл. таблицы в топике -->
<style>.post-author img.a-info{display:none!important}</style>
<script type="text/javascript">
function iconRedir(that) {
    $(that).parents('.post-author').find('.post-img-Sp.a-info')[0].click();
};
</script>


Как добавить в табличку награды пользователя(установленные через Rusff): пост #368
Как подключить HTML в постах к всплывающей табличке: пост #381

+2

321

бланш
У Вас чот не работает - аякс выдает 404 (Возможно указана не та тема
И кнопка открытия таблички - скрыта display:none!important - пришлось еще ее поискать

0

322

Alex_63
странно очень, у меня с гостя все открывается и кнопка не скрыта оО
сама кнопка - http://savepic.ru/10862347m.png , если что вдруг
но там я именно кидала тему с паспортом, если что, то вот другая тема

0

323

напоминаю о себе)  :flag:

0

324

бланш
Повторите вопрос, ибо забыл(и что нун сделать?)

0

325

бланш
Если Вы про пост 322 - то я ни наю, у Вас там в табличке контент прописан через старый скрипт HTML в постах с идентификатором  <!--HTML-->
Поясните плиз, а то мож я чот не то смотрю...

0

326

Deff написал(а):

бланш
Повторите вопрос, ибо забыл(и что нун сделать?)

Alex_63 написал(а):

бланш
Если Вы про пост 322 - то я ни наю, у Вас там в табличке контент прописан через старый скрипт HTML в постах с идентификатором  <!--HTML-->
Поясните плиз, а то мож я чот не то смотрю...

ну так мне нужно переписать на [html][/html] ))
если я ставлю просто так этот тег - не работает + title отображается не как нужно, т.е. без стиля

Отредактировано бланш (Пт, 28 Окт 2016 21:59:32)

0

327

бланш написал(а):

ну так мне нужно переписать на [html][/html] ))

1. Возьмите код HTML в посте(для таблички), выньте из блока код  [code][/code]удалив коммент  <!--HTML--> и оберните этот  код при редактирование в теги  [html][/html]

0

328

Deff написал(а):

1. Возьмите код HTML в посте(для таблички), выньте из блока код 

Код:

удалив коммент  <!--HTML--> и оберните этот  код при редактирование в теги  [html][/html]

ну ясное дело, что мы так делали уже, все же не пусто в голове хд нам нужно скрипт под работу этого прописать)
тут - все работает (ну, потому что в соо)

тут - нет (нажмите на хомяка у того же юзера)

собственно, почему и обращаемся

0

329

бланш
Пробуйте такой код:

Код:
<!-- HTML во всплывающуюю таблицу-->
<script type="text/javascript">
$(document).ready(function(){
  $('img.doubleIcon,img.a-info,.my-tabs>span').live('click',function(){
   $("li.tab-a .post-content:contains('[html]')").each(function(){
   var a =$(this).parents('li.tab-a')[0]; HTMLinPost.parseTags(a);
});});});
</script>

Поставьте сразу после скрипта всплывающей таблицы (<script img-data="http://img-fotki.yandex.ru/get/4706/119528728.a50/0_969f0_f4dd0f9a_S" src="http://forumstatic.ru/files/0013/44/56/57946.js"></script>)

+2

330

Deff
спасибо огромное, сработал!  :love:
а еще вопрос
как можно настроить стиль для title внутри этого кода? просто на всем форуме настроен
https://pp.vk.me/c837623/v837623343/946f/w6aZhZtQ6xM.jpg
а тут обычный
https://pp.vk.me/c837623/v837623343/9476/TKMtEi774LI.jpg

0

331

бланш
Пробуйте заменить скрипт HTML в табличку

<!-- HTML во всплывающуюю таблицу-->
<script type="text/javascript">
$(document).ready(function(){
  $('li.tab-a *').tipsy({live:true,fade: true, gravity: 's'});
  $('img.doubleIcon,img.a-info,.my-tabs>span').live('click',function(){
   $("li.tab-a .post-content:contains('[html]')").each(function(){
   var a =$(this).parents('li.tab-a')[0]; HTMLinPost.parseTags(a);
});});});
</script>

+2

332

Deff
все работает, выручили! *о*
и последний вопрос, немного не по теме - а как у titla сменить цвет треугольничка?)

0

333

бланш
Поставить в HTML верх, заменив картинку на нужный цвет(размеры сохраняем), замечу что картинка без прозрачности, прозрачность устанавливается на весь элемент подсказки отдельно,
Судя по всему заливка у пикчи должна быть цветом: #689E2C
Картинку лучше залить на форум, Администрирование - Файлы

<style>
.tipsy-arrow {
background: url("http://forum4.ru/i/tipsy.gif") no-repeat transparent;
height: 5px;
position: absolute;
width: 9px;
}
</style>

+1

334

Deff
еще раз спасибо преогромное))

0

335

Deff :blush: А добавь в первый пост темы этот код-правку для HTML в постах?

0

336

Подскажите как подключить нововведенные ББ теги к всплывающей табличке?
использую такой конвентер из хтмл в бб

Код:
<!-- ББ-теги для анкеты -->
<script language="javascript">
elm=document.getElementsByTagName("div")
for(x in elm)
{if(elm[x].className=="post-content") {
var post = elm[x].innerHTML;
if(post.indexOf("[/bga]") != -1) {
mods = /\[bga\](.*?)\[\/bga\]/gi
post = post.replace(mods, "<div class='bga'>$1</div>");
};
if(post.indexOf("[/bgb]") != -1) {
mods = /\[bgb\](.*?)\[\/bgb\]/gi
post = post.replace(mods, "<div class='bgb'>$1</div>");
};
if(post.indexOf("[/vneh]") != -1) {
mods = /\[vneh\](.*?)\[\/vneh\]/gi
post = post.replace(mods, "<div class='vneh'>$1</div>");
};
if(post.indexOf("[/myr]") != -1) {
mods = /\[myr\](.*?)\[\/myr\]/gi
post = post.replace(mods, "<div class='myr'>$1</div>");
};
if(post.indexOf("[/my]") != -1) {
mods = /\[my\](.*?)\[\/my\]/gi
post = post.replace(mods, "<div class='my'>$1</div>");
};
if(post.indexOf("[/ss]") != -1) {
mods = /\[ss\](.*?)\[\/ss\]/gi
post = post.replace(mods, "<div class='ss'>$1</div>");
};
if(post.indexOf("[/zg]") != -1) {
mods = /\[zg\](.*?)\[\/zg\]/gi
post = post.replace(mods, "<div class='zg'>$1</div>");
};
if(post.indexOf("[/ap]") != -1) {
mods = /\[ap\](.*?)\[\/ap\]/gi
post = post.replace(mods, "<div class='ap'>$1</div>");
};
if(post.indexOf("[/apb]") != -1) {
mods = /\[apb\](.*?)\[\/apb\]/gi
post = post.replace(mods, "<div class='apb'>$1</div>");
};
if(post.indexOf("[/apbr]") != -1) {
mods = /\[apbr\](.*?)\[\/apbr\]/gi
post = post.replace(mods, "<div class='apbr'>$1</div>");
};
if(post.indexOf("[/ez]") != -1) {
mods = /\[ez\](.*?)\[\/ez\]/gi
post = post.replace(mods, "<div class='ez'>$1</div>");
};
if(post.indexOf("[/rb]") != -1) {
mods = /\[rb\](.*?)\[\/rb\]/gi
post = post.replace(mods, "<div class='rb'>$1</div>");
};
if(post.indexOf("[/vt]") != -1) {
mods = /\[vt\](.*?)\[\/vt\]/gi
post = post.replace(mods, "<div class='vt'>$1</div>");
};
elm[x].innerHTML = post;}}
</script>
<!-- ББ-теги для анкеты -->

Но в табличке теги отображаются просто текстом, без стилизации

скрин

http://i.imgur.com/XcnK5nI.png

(в теме все хорошо отображается, такой баг только со всплывающей табличкой)
как-то получилось один раз добиться отображения нововведенных бб, но оно сломало отображение хтмл во всплывающей табличке и пришлось вернуть все на свои места х)
сейчас для отображения хтмл в табличке стоит такой скрипт

Код:
<!--возможность вставлять хтмл в табличку с инфой-->
<script type="text/javascript">
$(document).ready(function(){
$('li.tab-a *').tipsy({live:true,fade: true, gravity: 's'});
  $('img.doubleIcon,img.a-info,.my-tabs>span').live('click',function(){
   $("li.tab-a .code-box").each(function(){
    if($(this).text().indexOf('<!--magic-button-->')!=-1){
    $(this).wrap('<div class="htmldemo"></div>')
    $(this).replaceWith($('.htmldemo').text().split('<!--magic-button-->')[1]);}
});});});
</script>

<!--возможность вставлять хтмл в табличку с инфой-->

Отредактировано pusheen. (Пн, 14 Ноя 2016 20:16:22)

0

337

pusheen.
Попробуй так

Код:
<!--возможность вставлять хтмл в табличку с инфой-->
<script type="text/javascript">
$(document).ready(function(){
$('li.tab-a *').tipsy({live:true,fade: true, gravity: 's'});
  $('img.doubleIcon,img.a-info,.my-tabs>span').live('click',function(){
   $("li.tab-a .code-box").each(function(){
    if($(this).text().indexOf('<!--magic-button-->')!=-1){
    $(this).wrap('<div class="htmldemo"></div>')
    $(this).replaceWith($('.htmldemo').text().split('<!--magic-button-->')[1]);}
});
    $("li.tab-a").each(function(){
var post = this.innerHTML;
if(post.indexOf("[/bga]") != -1)post = post.replace(/\[bga\](.*?)\[\/bga\]/gi, "<div class='bga'>$1</div>");
if(post.indexOf("[/bgb]") != -1)post = post.replace(/\[bgb\](.*?)\[\/bgb\]/gi, "<div class='bgb'>$1</div>");
if(post.indexOf("[/vneh]") != -1)post = post.replace(/\[vneh\](.*?)\[\/vneh\]/gi, "<div class='vneh'>$1</div>");
if(post.indexOf("[/myr]") != -1)post = post.replace(/\[myr\](.*?)\[\/myr\]/gi, "<div class='myr'>$1</div>");
if(post.indexOf("[/my]") != -1)post = post.replace(/\[my\](.*?)\[\/my\]/gi, "<div class='my'>$1</div>");
if(post.indexOf("[/ss]") != -1)post = post.replace(/\[ss\](.*?)\[\/ss\]/gi, "<div class='ss'>$1</div>");
if(post.indexOf("[/zg]") != -1)post = post.replace(/\[zg\](.*?)\[\/zg\]/gi, "<div class='zg'>$1</div>");
if(post.indexOf("[/ap]") != -1)post = post.replace(/\[ap\](.*?)\[\/ap\]/gi, "<div class='ap'>$1</div>");
if(post.indexOf("[/apb]") != -1)post = post.replace(/\[apb\](.*?)\[\/apb\]/gi, "<div class='apb'>$1</div>");
if(post.indexOf("[/apbr]") != -1)post = post.replace(/\[apbr\](.*?)\[\/apbr\]/gi, "<div class='apbr'>$1</div>");
if(post.indexOf("[/ez]") != -1)post = post.replace(/\[ez\](.*?)\[\/ez\]/gi, "<div class='ez'>$1</div>");
if(post.indexOf("[/rb]") != -1)post = post.replace(/\[rb\](.*?)\[\/rb\]/gi, "<div class='rb'>$1</div>");
if(post.indexOf("[/vt]") != -1)post = post.replace(/\[vt\](.*?)\[\/vt\]/gi, "<div class='vt'>$1</div>");
this.innerHTML = post;})
    ;});});
</script>

+1

338

Alex_63
о, так работает о.О
Спасибо с:
т.е. ББ конвентер дублируется? один для формы ответа, второй для всплывашки, я правильно поняла?

0

339

pusheen. написал(а):

т.е. ББ конвентер дублируется? один для формы ответа, второй для всплывашки, я правильно поняла?

Да  (Правда парсер для всплывалки я чуть сократил

0

340

Подскажите пожалуйста, попыталась поставить скрипт всплывающей таблички, сделала как положено:
- отдельный подфорум для табличек скрытый для всех кроме администрации;
- создала дополнительное поле;
- в это поле поставила <a href=#tid=237></a> при этом ссылка на тему http://nolf.rusff.ru/viewtopic.php?id=237
- поставила номер подфорума на своём форуме вместо 16:

Deff написал(а):

<script img-data="http://sa.uploads.ru/SoT3N.png" src="http://forumstatic.ru/files/0013/44/56/57946.js" forum="16"></script>

- также стоят скрипты переадресации и хтмл в таблице;
- в первом сообщение темы для таблицы начала с [mark][/mark]

Но при нажатии на картинку таблица не появляется.

http://funkyimg.com/i/2kXf9.jpg
http://funkyimg.com/i/2kXfa.jpg

Вот ссылка на тему со скрина: http://nolf.rusff.ru/viewtopic.php?id=235#p13646 (Силвия Руссо)

Что я сделала не так? Как это исправить? Может конфлитует со скриптом каким? (На форуме стоит достаточно много скриптов, в том числе и подфорумы).

Заранее спасибо за помощь!

0


Вы здесь » Единый форум поддержки » Новые возможности форумов » Выпадающая Табличка по клику на иконку в профиле топика: