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

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

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


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


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

Сообщений 461 страница 480 из 524

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="https://forumstatic.ru/files/0013/44/56/73823.css" />
<script img-data="
http://sa.uploads.ru/SoT3N.png" src="https://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 темы, при клике на форум с главной, считываем в адресном окне браузера:
Пример по клику текущего форума со скриптами:
https://forum.mybb.ru/viewforum.php?id=16
И вставляем в атрибут скрипта forum= вместо красного, - свою цифру.

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

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


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

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


Вариант размещения кликабельной кнопки:
http://qps.ru/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

461

Deff
Жаль, но что поделать :с

А со сдвигами реально что-то сделать? С неприятностями в мобильных версиях мы ещё готовы были смириться, но то, что компьютерные браузеры по разному считают отступы, стало неприятным сюрпризом.

0

462

Аллинэя
У Вас Профиль криво свёрстан,(много недочётов) и думаю и сама табличка тоже, сейчас в запарке(занят) до конца мая
Можно попросить поправить платно у Герды на форуме => http://forumd.ru/search.php?action=show_24h


Ксать вот тут, на партнёрке http://bestbb.ru/ смена имиджа(или маска) уже отлаженная стоит /А есть и подфорумы и ещё фичи/ Тест: http://imagepresent.bestbb.ru/viewtopic.php?id=2

Отредактировано Deff (Ср, 11 Апр 2018 23:28:48)

0

463

Deff
Ясно, спасибо за консультацию

0

464

Прошу прощения, проблему решили

Здравствуйте. Прошу прощения за вопрос, так как, скорей всего, дело в моей неопытности.
Поставил скрипт на форум и вроде все было хорошо, но внезапно (действительно внезапно, так как некоторое время после установки все было просто замечательно и, вроде бы, ничего нигде не менялось, а сам скрипт добавлялся самым последним из всех добавленных) возникла очень неприятная проблема со сдвигом всплывающей таблицы профиля вверх и прилипанием его к адресной строке браузера. При чем, сдвигается он ровно на ширину "ушек" и те пропадают где-то за этой строкой ввода адреса. Я пытался изменять значения сдвига вверх относительно иконки в скрипте, но таблица все равно прилипает. Я пытался перемещать "ушки"  столбиком влево, относительно таблицы, но она упорно прилипает на то же расстояние, съедая первое ушко и часть таблицы, равное ему. И да, ушки действительно есть и это видно в момент закрытия окошка, когда оно съезжает вниз, показывая их.
Я обескуражен. 
Тем более, что одно время была довольно забавная ситуация, когда с одного браузера на одном компе под одним аккаунтом ушки были видны, а под другим аккаунтом были не видны. (теперь они не видны под всеми).
Так же данная проблема у некоторых пользователей не возникает, хоть и используются одинаковые браузеры.

Перечитал всю тему и, вроде как, ничего подобного своему случаю не нашел.
С чем может быть связан подобный глюк? Может, все же, у меня что-то уехало в скрипте? Или это программный глюк браузеров?

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

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

<!-- Переадресация клика со своей Иконки для Вспл. таблицы в топике -->
<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>

    <!-- Включаем HTML в Постах в Вспл.табличке-->
    <script type="text/javascript">
    $(function(){$('img.a-info,.my-tabs>span').live('click',function(){$("li.tab-a").map(function(){HTMLinPost.parseTags($(this).attr("data-group-id",0))});});});
    </script>

Отредактировано Zouk (Пт, 11 Май 2018 12:10:16)

+1

465

Как заставить работать в этой табличке тег indent из скрипта отступа? Уже стоит некая заплатка, чтобы там работал свой BB-тег, но не уверена, что справлюсь с самостоятельным добавлением и этого.

0

466

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

Код:
<!-- Всплывающая таблица с вкладками, в топике, с инфой о персонаже -->
<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;
}

</style>
<link rel="stylesheet" type="text/css" href="https://forumstatic.ru/files/0019/a7/ad/29303.css" />
<script img-data="http://sa.uploads.ru/SoT3N.png" src="https://forumstatic.ru/files/0019/a7/ad/17170.js" forum="0"></script>
<!--//End//Всплывающая таблица с вкладками, в топике, с инфой о персонаже// -->
<!-- Переадресация клика со своей Иконки для Вспл. таблицы в топике -->
<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>
<!--возможность вставлять хтмл в табличку с инфой-->
<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("[/t]") != -1)post = post.replace(/\[t\](.*?)\[\/t\]/gi, "<div id='t'>$1</div>");
this.innerHTML = post;});
    ;});});
</script>
<!-- Включаем HTML в Постах в Вспл.табличке-->
<script type="text/javascript">
$(function(){$('img.a-info,.my-tabs>span').live('click',function(){$("li.tab-a").map(function(){HTMLinPost.parseTags($(this).attr("data-group-id",0))})
(function(){var c="[indent",h,e='<span style="display:inline-block;margin:YYem XXem;"></span>';
$("#button-strike").after('<td id="button-indent" title="Отступы"><img src="/i/blank.gif"  onclick="smile(\''+c+'=2,1]\')\"></td>');
function a(b,d){if(!d){return e.replace("XX","2").replace("YY","1")} /*удвоенные Отступы слева и сверху по умолчанию*/
else{return d.replace(/=(\d+(?:\.\d+)?)((?:,\d+(?:\.\d+)?)?)$/,function(f,i,g){h=e.replace("XX",i);v=g.substr(1);return h.replace("YY",(v?v:"0"));
})}}$('.post-content p:contains("'+c+'")').each(function(){$(this).html($(this).html().replace(/\[indent([=\d\.,]*?)\]/gm,a))})}());
;});});
</script>

+2

467

Deff, работает, огромное спасибо!

0

468

Deff
А можно ли перенос отступов indent в табличку настроить так, чтобы они не становились в четыре раза больше, чем в самом посте?(

0

469

Asche

Отредактировано Deff (Чт, 27 Сен 2018 20:36:10)

0

470

Deff
Вот так оно выглядит сейчас в табличке:

И можно вас попросить ссылку на тестовик убрать? ^ ^") Когда ее каждый заходящий видит, это смущает очень))
Заранее спасибо!)

0

471

Asche
Пробуйте в HTML верх

<style>
li.tab-a .post-content span[style="display:inline-block;margin:1em 2em;"]{
  margin:0.6em 0.5em!important;
}
</style>

+1

472

Deff
Работает, спасибо вам!))

0

473

Добрый день.
У меня проблема с данным кодом. При нажатии на картинку, вкладки таблицы улетает вверх. Примерно так это выглядит:

картинка

https://i.imgur.com/zfVg2rpm.jpg

Пробовала ставить чистый код, ничего не помогает. Может подскажете в чем может быть проблема?

0

474

Dessany
Дайте тестовый ник-пароль в тему и ссылку на профиль с табличкой

0

475

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

Добавка Rusff-Наград пользователя во всплывающую табличку

Отредактировано Кэролайн Джоанн Сандерс (Чт, 8 Ноя 2018 16:14:21)

0

476

Кэролайн Джоанн Сандерс
В принципе в текущем скрипте можно поправить кнопки, чтобы были слево( имхо по-моему даж было где-то по теме)

Отредактировано Deff (Чт, 8 Ноя 2018 16:20:38)

0

477

Dessany
Пробуйте заменить код на такой:

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

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

Там были ошибки и красным регулировка отступа

+2

478

Deff
вроде работает) огроооомное спасибо)

+1

479

ребят такая проблема
при нажатии на плашку последнего автора в теме личная страницы вылезает адекватно всегда
https://i.imgur.com/bsxivAC.png

при нажатии на автора выше она вылезает выше положенного скрывая дополнительные кнопки
https://i.imgur.com/TZ7WRIe.png

0

480

xl
Попробуйте в HTML низ
Ниже кода с табличкой

<style>
.my-tabs {
    padding-top:100px!important;
}
</style>

Отредактировано Deff (Ср, 5 Дек 2018 21:30:23)

0


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