<div class='character'>
<h2>18</h2>
<div class="menu">
<div class="menu-links">
<span alt="#sm1" onclick='showTab(this);'>Имя</span>
<span alt="#sm2" onclick='showTab(this);'>Биография</span>
<span alt="#sm3" onclick='showTab(this);'>Характер</span>
<span alt="#sm4" onclick='showTab(this);'>Внешность</span>
</div>
</div>
<div id="submenu">
<div id="sm1" class="submenutext" style="display:block;">
<br/><br/>
текст 1
</div>
<div id="sm2" class="submenutext">
<br /><br />
текст 2
</div>
<div id="sm3" class="submenutext">
<br /><br />
текст 3
</div>
<div id="sm4" class="submenutext">
<br /><br />
текст 4
</div>
</div>
</div>
Люсьен
Сообщений 1 страница 11 из 11
Поделиться1Пт, 18 Авг 2023 10:34:41
Поделиться2Пт, 18 Авг 2023 12:36:47
/*Стиль иконки в мини-профиле*/
img.a-info{
padding:2px;
display:block!important;
cursor:pointer;
position:absolute;
text-align:left!important;
}
/* Затемняющий фон */
#pre-wrap {
position: fixed;
display: flex;
align-content: center;
justify-content: center;
align-items: center;
z-index: 1000;
width: 100%;
height: 100%;
left: 0;
top: 0;
background: rgba(0, 0, 0, .4);
cursor: pointer;
}
/*Подвижка иконки закрытия таблички*/
.my-tabs > img.close {
float: right;
margin: 0 -37px 0 0!important;
width: 14px;
}
/* Корневой таб(UL) */
.my-tabs{
display:block;
z-index:30000;
position:absolute;
max-height:700px; /*максимальная высота таблички*/
}
/* Стиль "Ушка" вкладок */
.my-tabs>span{
color: var(--color-white);
background: var(--color-black);
cursor: pointer;
display: block!important;
position: relative;
z-index: 12;
padding: 4px 10px 5px;
margin-bottom: -10px!important;
border-radius: 5px;
text-align: center;
float: left;
}
/* Cдвиг самого первого "Уха" */
.my-tabs>span:first-child{
margin-left: 8px;
}
/* Активное "Ушко" */
.my-tabs>span.selected{
opacity:1;
border-bottom-color:transparent!important;
}
/* Стиль вкладки(LI)*/
.my-tabs>.tab-a{
width:100%;
height:100%;
position:relative;
z-index:1;
display:none;
overflow-y:auto;
overflow-x:hidden;
text-align:center;
vertical-align:middle;
border-radius: 10px;
padding:4px 12px!important;
}
/*Отступ контента вкладки сверху*/
.tab-a .post-content{
margin-top:1.4em;
text-align:left;
display:inline-block;
}
/*Подвижка иконки*/
img.a-info{
margin-top: -3px!important;
margin-left: 173px!important;
width:30px; /*Размер иконки*/
}
/*Подвижка всплывающей подсказки иконки*/
.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:255px; /*сдвиг таблицы вправо от положения иконки*/
}
.my-tabs>.tab-a {
background: var(--color-grey);
}
Поделиться3Пт, 18 Авг 2023 12:37:02
<!-- Всплывающая таблица с вкладками, в топике, с инфой о персонаже -->
<script img-data="http://sa.uploads.ru/SoT3N.png" src="https://forumstatic.ru/files/0013/44/56/57946.js" forum="18"></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>
Поделиться4Пн, 21 Авг 2023 22:42:45
личная страница
Сугубо добровольная активность; можно ставить, можно не ставить; можно поставить только одну вкладку из трёх. Никаких дополнительных плюшек не даёт, кроме личного удовлетворения и капельки азарта.
ВАЖНО! если вы хотите личную страницу, вам для начала придётся поставить плашку, ибо личная страница (при наличии) открывается по нажатию на неё.
ВАЖНО!(2) личные страницы доступны гостям для просмотра, а посему не забывайте про правила ресурса и правила форума, всякие неприличности не ставим, не пишем, не ссылаемся,иначе к вам придёт представитель местного цензурного комитета.
внешний вид и пример заполнения
На вкладке "персональная информация" можно поставить изображение размером 180x180px (статическое, анимированное, содержащее внешность вашего персонажа, купленный вчера арбуз или любимый мемчик) и какую-угодно информацию (цитату, целое стихотворение, короткое эссе на тему как вы провели лето). Вкладка поддерживает синтаксис html, соответственно можно указать какие-нибудь ссылки - на профиль другого персонажа, на профили ваших твинков, на какой-нибудь сторонний ресурс (а-ля youtube или Яндекс.Музыка).
personal info[html]
<style>#submenu {width: 565px;}
#sm1 > div > div.about {width: 300px;}
div.pers{width: 550px;}
</style>
<div class='character'>
<div id="submenu">
<div id="sm1" class="submenutext" style="display:block;"><br/>
<div class="pers">
<div class="face" style="background:url(https://forumstatic.ru/files/001b/e4/bf/81501.jpg)"></div>
<div class="about">Я календарь переверну -<br>
И снова 3-е сентября.<br>
На фото я <a href="https://sept3rd.rusff.me/">твое</a> взгляну - <br>
И снова 3-е сентября.<br>
Но почему, но почему<br>
Расстаться все же нам пришлось?<br>
Ведь было все у нас всерьез 2-го сентября...<br>
<br>
<br>
<a href="https://www.youtube.com/watch?v=bVtNcmCoUG4&ab_channel=koshkamoroshka">Стигмата - Сентябрь // Юля Кошкина</a>
</div>
</div>
</div>
</div>
</div>[/html]Вкладка "общее" содержит ачивки, которые зарабатываются в ходе разноплановой активности на форуме. Ачивки не сквозные, т.е. если у вас три персонажа, у каждого будет своя статистика. Полученные и не полученные достижения подсвечиваются разным цветом, дополнительно имеется всплывающая подсказка - получено достижение или ещё нет.
general[html]
<style>#submenu {width: 565px;}
div.ach{width: 550px;margin:5px}
</style>
<div class='character'>
<div id="submenu">
<div id="sm2" class="submenutext" style="display:block;"><br/>
<h1>сообщения</h1>
<div class="ach">
<div class="unlock">100</div>
<div class="lock">500</div>
<div class="lock">1k</div>
<div class="lock">2,5k</div>
<div class="lock">5k</div>
</div><h1>уважение</h1>
<div class="ach">
<div class="lock">100</div>
<div class="lock">500</div>
<div class="lock">1k</div>
<div class="lock">1,5k</div>
<div class="lock">2k</div>
</div><h1>позитив</h1>
<div class="ach">
<div class="lock">100</div>
<div class="lock">500</div>
<div class="lock">1k</div>
<div class="lock">1,5k</div>
<div class="lock">2k</div>
</div><h1>заполнение профиля</h1>
<div class="ach">
<div class="lock">статус</div>
<div class="lock">личное звание</div>
<div class="lock">плашка</div>
<div class="lock">личная страница</div>
<div class="lock">личная тема</div>
</div><h1>банк</h1>
<div class="ach">
<div class="lock">был в банке</div>
<div class="lock">купил плашку</div>
<div class="lock">подарил подарок</div>
<div class="lock">заработал на пазлах</div>
<div class="lock">накопил 5k голды</div>
</div><h1>активность</h1>
<div class="ach">
<div class="lock">флудил</div>
<div class="lock">играл в игры</div>
<div class="lock">приносил цитату</div>
<div class="lock">делился музыкой</div>
<div class="lock">рекомендовал кино</div>
</div><h1>заявки в "нужные"/"хочу видеть"</h1>
<div class="ach">
<div class="lock">1</div>
<div class="lock">5</div>
<div class="lock">10</div>
<div class="lock">15</div>
<div class="lock">20</div>
</div><h1>реклама форума</h1>
<div class="ach">
<div class="lock">10</div>
<div class="lock">25</div>
<div class="lock">50</div>
<div class="lock">100</div>
<div class="lock">250</div>
</div><h1>провёл на форуме</h1>
<div class="ach">
<div class="lock">24 часа</div>
<div class="lock">3 дня</div>
<div class="lock">7 дней</div>
<div class="lock">15 дней</div>
<div class="lock">30 дней</div>
</div><h1>прописан на форуме</h1>
<div class="ach">
<div class="lock">7 дней</div>
<div class="lock">15 дней</div>
<div class="lock">1 месяц</div>
<div class="lock">3 месяца</div>
<div class="lock">1 год</div>
</div>
</div>
</div>
</div>
[/html]На вкладке "в игре" собраны достижения, которые можно получить исключительно методом открытия эпизодов и написания постов. Учитывается игра в любом разделе - личные эпизоды / альтернатива. Многие пункты могут показаться вам неоднозначными, выполнили ли вы условия для получения такой ачивки, мы предлагаем вам решать самостоятельно. Но, если вы очень сильно сомневаетесь и хотите админского благословения или разъяснения, всегда можно спросить.
in game[html]
<style>#submenu {width: 565px;}
div.ach{width: 550px;margin:5px}
</style>
<div class='character'>
<div id="submenu">
<div id="sm3" class="submenutext" style="display:block;"><br/>
<h1>посты</h1>
<div class="ach">
<div class="unlock">1</div>
<div class="lock">10</div>
<div class="lock">50</div>
<div class="lock">100</div>
<div class="lock">250</div>
</div><h1>закрытые эпизоды</h1>
<div class="ach">
<div class="lock">1</div>
<div class="lock">5</div>
<div class="lock">10</div>
<div class="lock">20</div>
<div class="lock">50</div>
</div><h1>пасхалки в постах</h1>
<div class="ach">
<div class="lock">упомянул кентавра</div>
<div class="unlock">взглянул на фото</div>
<div class="unlock">перевернул календарь</div>
<div class="lock">сентябрь сгорел</div>
<div class="lock">убийца заплакал</div>
</div><h1>калифорникейшн</h1>
<div class="ach">
<div class="lock">ходил на пляж</div>
<div class="lock">встретил селебрити</div>
<div class="lock">видел бомжа</div>
<div class="lock">тусил до утра</div>
<div class="lock">ездил в Вегас</div>
</div><h1>приключения</h1>
<div class="ach">
<div class="lock">угодил в неприятности</div>
<div class="lock">разгадал загадку</div>
<div class="lock">вымок под дождём</div>
<div class="lock">испортил вещь</div>
<div class="lock">причастен к преступлению</div>
</div><h1>приятные события</h1>
<div class="ach">
<div class="unlock">съел что-то вкусное</div>
<div class="unlock">выспался</div>
<div class="unlock">получил подарок</div>
<div class="unlock">слушал музыку</div>
<div class="unlock">ходил в кино</div>
</div><h1>рутина</h1>
<div class="ach">
<div class="lock">готовил еду</div>
<div class="lock">делал уборку</div>
<div class="lock">выбрасывал мусор</div>
<div class="lock">принимал душ</div>
<div class="lock">работал работу</div>
</div><h1>эмоции +</h1>
<div class="ach">
<div class="lock">радость</div>
<div class="lock">смех</div>
<div class="lock">удивление</div>
<div class="lock">удовлетворение</div>
<div class="lock">любовь</div>
</div><h1>эмоции -</h1>
<div class="ach">
<div class="lock">грусть</div>
<div class="lock">слёзы</div>
<div class="lock">страх</div>
<div class="lock">злость</div>
<div class="lock">разочарование</div>
</div><h1>время</h1>
<div class="ach">
<div class="lock">вспоминал прошлое</div>
<div class="lock">думал о будущем</div>
<div class="lock">жил моментом</div>
<div class="lock">размышлял о вечном</div>
<div class="lock">грезил о несуществующем</div>
</div>
</div>
</div></div>[/html]
как заполнять
Вопросы по личной странице приносите прямо сюда. Первоначальное заполнение и дальнейшее изменение данных ведём тоже в этой теме. Для вашего и нашего удобства сообщения отсюда не удаляются / не переносятся в архив.
Формат заполнения:
Код:[b]personal info картинка:[/b] ссылка-на-картинкуКод:[b]personal info текст:[/b] ваш-текст-с-ссылками-или-безКод:[b]general:[/b] категория-такая-то : ачивка-такая-тоКод:[b]in game:[/b] категория-такая-то : ачивка-такая-тоКаких-либо доказательств своих достижений приносить не требуем, только если вам самим так проще отслеживать. Если вы хотите добавить ссылок или какого-то оформления в текстовый блок персональной информации, но не знаете, как, приносите макет, оформим.
Поделиться5Пт, 2 Фев 2024 14:34:32
можно поставить только одну вкладку из трёх. Никаких дополнительных плюшек не даёт, кроме личного удовлетворения и капельки азарта.
Поделиться6Чт, 29 Фев 2024 09:43:35
<script>document.querySelectorAll('.category tr').forEach((forum) => { //Тут можно поменять тексты перед цифрами тем и постов const classToName = {'tc2': '', 'tc3': '/'}; const topicsAndPosts = []; const forumH3 = forum.querySelector('h3'); if (!forumH3) return; forum.querySelectorAll('.tc2, .tc3').forEach(el => { const content = el.innerText; if (Number.isNaN(+content)) return; const labelText = el.classList.contains('tc2') ? classToName.tc2 : classToName.tc3; const res = document.createElement('span'); res.insertAdjacentHTML('afterbegin', `<b>${labelText}</b> ${content}`); res.classList.add(el.classList.contains('tc2') ? 'topics' : 'posts'); el.remove(); topicsAndPosts.push(res); }); forumH3.insertAdjacentHTML('beforebegin', '<div class="forum-title"></div>'); const leftContainer = forum.querySelector('.forum-title'); const topicsAndPostsContainer = document.createElement('div'); topicsAndPostsContainer.classList.add('topics-and-posts'); topicsAndPostsContainer.append(...topicsAndPosts) leftContainer.append(forumH3, topicsAndPostsContainer); });</script>
Поделиться7Чт, 29 Фев 2024 09:51:29
<script type="text/javascript"> (function(){ $.catch = function(a,f){$(function(){var t,i=0;function s(){i++;if(i>120)return;t=setTimeout(function(){if(!$(a).length){s();return};f()},100);}s();});} function appendTopicS(){ $('.category .tcr').each(function() { var L=$(this).parents('tr:first'); var str='<div class="Add"><div class="Tems_And_messages">'+L.find('td.tc2').text()+'/'+L.find('td.tc3').text()+'</div>\ </div>';$(str).insertAfter(this); }); } if($('#pun-index').length){appendTopicS ();} if($('#pun-viewforum').length){ var summ=$('.main table[summary]').attr('summary').split(': ')[1].substr(0,1); if(summ=='#'||summ==String.fromCharCode(173))$.catch('#f-subforums',function(){appendTopicS()}); } }()); </script>
Поделиться8Чт, 9 Май 2024 21:02:26
[dice]count = 1 | sides = 100 | bonus = 0 | fine = 0 | reason = [/dice]
wwew
Поделиться10Вс, 19 Май 2024 01:42:31
[html]<style>
/* Общие стили для кастомизации*/
.custom-calendar {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 5px;
margin: auto;
}
.custom-day {
text-align: left;
padding:16px;
font-size: 18px;
border: 1px dotted var(--color-grey2);
background-color: var(--color-white);
color: var(--color-black);
font-family: var(--custom);
}
z{font:normal 10px verdana, arial, helvetica, sans-serif}
z > a {color:var(--color-nice)!important}
</style>
<body>
<div class=custom-calendar>
<div class=custom-day>A / B / C / D<br>
<z>
</z></div>
<div class=custom-day>E / F / G / H<br>
<z>
</z></div>
<div class=custom-day>I / J / K / L<br>
<z>
</z></div>
<div class=custom-day>M / N / O / P<br>
<z>
Polina Gagarina > <a href="https://sept3rd.rusff.me/profile.php?id=13">Avianna Grant</a> > личный помощник Нильса Хаббарда<br>
</z></div>
<div class=custom-day>Q / R / S / T<br>
<z>
Sergey Lazarev > <a href="https://sept3rd.rusff.me/profile.php?id=7">Niels Hubbard</a> > директор Девелоперской компании Hubbard Construction Company<br>
</z></div>
<div class=custom-day>U / V / W / X / Y / Z<br>
<z>
</z></div>
</div>
</body>
[/html]
Поделиться11Вс, 19 Май 2024 01:45:48
Name Surname внешности > <a href="ссылка на профиль">Name Surname персонажа</a> > организация, должность (в двух словах, указываем *основной* род деятельности персонажа на момент игры)<br>