Автор |
Сообщение |
|
|
Администратор |
 |
Стаж: 9 лет 4 месяца 20 дней Сообщения: 1235 Откуда: здешние мы
Стиль: subsilver2
Репутация: 11
перейти на сайт пользователя
Найти темы пользователя
|
Небольшой интересный скриптик открытия. ПростойНа основе этого скрипта реализованы блоки здесь, внизу страницы. Можно посмотреть демо (в "голом" варианте - без оформления): демоА это демо со встроенным оформлением анимированных кнопок: демо с cssНикаких файлов на сервер загружать не надо - только код. Пример: Код: Выделить всё <script type="text/JavaScript"> $(document).ready(function() { //Действие по умолчанию $(".tab_content").hide(); //Скрыть все содержимое $("ul.tabs span:first").addClass("active").show(); //Активировать первую вкладку $(".tab_content:first").show(); //Показать первые содержание вкладке //По щелчку события $("ul.tabs span").click(function() { $("ul.tabs span").removeClass("active"); //Удалите все "active" класс $(this).addClass("active"); //Добавить "active" класса выбранной вкладки $(".tab_content").hide(); //Скрыть вкладку Все содержание var activeTab = $(this).find("a").attr("href"); //Найти относительной значение атрибута для выявления активной вкладки + содержание $(activeTab).fadeIn(); //Fade в активного содержимого return false; }); }); </script> <div> <div style="border:1px solid #b5b5b5;padding:1px"> <ul class="tabs"> <span><a class="" href="#tab1"><b>1</b></a></span> <span><a class="" href="#tab2"><b>2</b></a></span> <span><a class="" href="#tab3"><b>3</b></a></span> <span><a class="" href="#tab4"><b>4</b></a></span> <span><a class="" href="#tab5"><b>5</b></a></span> </ul> </div> <div style="border:1px solid #b5b5b5;padding:5px;text-align:center"> <div id="tab1" class="tab_content"> первый контейнер </div> <div id="tab2" class="tab_content"> второй контейнер </div> <div id="tab3" class="tab_content"> третий контейнер </div> <div id="tab4" class="tab_content"> четвёртый контейнер </div> <div id="tab5" class="tab_content"> пятый контейнер </div> </div> </div> где Код: Выделить всё <span><a class="" href="#tab1"><b>1</b></a></span> - ссылка на открытие первого блока Код: Выделить всё <div id="tab1" class="tab_content"> первый контейнер </div> - сам первый блок с информацией... Для работы скрипта у вас должна быть подключена библиотека . Если у вас её нет - подключить можно примерно так: В "шапке" сайта найти Вставить перед найденным Код: Выделить всё <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> Кому удобнее разбираться самостоятельно у себя на компе - можно скачать демо-версию скрипта: "голый" вариант: Скачать из файлового архива сайтавариант со стилем: Скачать из файлового архива сайта
|
|
трёхголовый белк семейства рептилоидов: "три головы - хорошо, на как же трудно придти к согласию..."
|
|
javascript
|
 |
|
|
Стаж: 8 лет 29 дней Сообщения: 741
Стиль: prosilver
Репутация: 15
перейти на сайт пользователя
Найти темы пользователя
|
В целом мне понятно как работает данный скрипт. Но как грамотно им воспользоваться, не очень Я так понимаю, что все изменения должны быть сделаны в файле overall_footer.html В этом файле вывод информации содержится в этом коде: Код: Выделить всё <li class="icon-home"><a href="{U_INDEX}" accesskey="h">{L_INDEX}</a></li> <!-- IF not S_IS_BOT --> <!-- IF S_WATCH_FORUM_LINK --><li <!-- IF S_WATCHING_FORUM -->class="icon-unsubscribe"<!-- ELSE -->class="icon-subscribe"<!-- ENDIF -->><a href="{S_WATCH_FORUM_LINK}" title="{S_WATCH_FORUM_TITLE}">{S_WATCH_FORUM_TITLE}</a></li><!-- ENDIF --> <!-- IF U_WATCH_TOPIC --><li <!-- IF S_WATCHING_TOPIC -->class="icon-unsubscribe"<!-- ELSE -->class="icon-subscribe"<!-- ENDIF -->><a href="{U_WATCH_TOPIC}" title="{L_WATCH_TOPIC}">{L_WATCH_TOPIC}</a></li><!-- ENDIF --> <!-- IF U_BOOKMARK_TOPIC --><li class="icon-bookmark"><a href="{U_BOOKMARK_TOPIC}" title="{L_BOOKMARK_TOPIC}">{L_BOOKMARK_TOPIC}</a></li><!-- ENDIF --> <!-- IF U_BUMP_TOPIC --><li class="icon-bump"><a href="{U_BUMP_TOPIC}" title="{L_BUMP_TOPIC}">{L_BUMP_TOPIC}</a></li><!-- ENDIF --> <!-- ENDIF --> <li class="rightside"><!-- IF not S_IS_BOT --><a href="{U_MOBILE_ON}">{L_MOBILE_ON}</a> • <!-- ENDIF --><!-- IF U_TEAM --><a href="{U_TEAM}">{L_THE_TEAM}</a> • <!-- ENDIF --><!-- IF not S_IS_BOT --><a href="{U_DELETE_COOKIES}">{L_DELETE_COOKIES}</a> • <!-- ENDIF -->{S_TIMEZONE}</li> Хотелось бы понять, что есть что, для начала. Буду сюда писать свои мысли, если нет возражений. <!-- IF S_WATCH_FORUM_LINK --> это Список форумов <!-- IF U_WATCH_TOPIC --> - ? // КТО СЕЙЧАС НА КОНФЕРЕНЦИИ <!-- IF U_BOOKMARK_TOPIC --> - ? // ТОПЛИСТ БЛАГОДАРНОСТЕЙ <!-- IF U_BUMP_TOPIC --> - ? // СТАТИСТИКА {U_MOBILE_ON}">{L_MOBILE_ON} - мобильная версия <!-- IF U_TEAM --> это наша команда {U_DELETE_COOKIES} - удалить куки {S_TIMEZONE} - часовой пояс Добавлено спустя 11 минут 33 секунды:1. Теперь дальше. Допустим я хочу вывести несколько блоков. | Кто сейчас на форуме || Статистика || Топлист Благодарностей || Инфо по форуму 2. Правлю файл overall_footer.html в соответствии с первым постом. 3. Составляю таблицу: 3.1 Первая вкладка: Кто сейчас на форуме <span><a class="" href="#tab1"><b>Кто сейчас на форуме</b></a></span> Какую ссылку прописывать? <!-- IF U_WATCH_TOPIC --><li <!-- IF S_WATCHING_TOPIC -->class="icon-unsubscribe"<!-- ELSE -->class="icon-subscribe"<!-- ENDIF -->><a href="{U_WATCH_TOPIC}" title="{L_WATCH_TOPIC}">{L_WATCH_TOPIC}</a></li><!-- ENDIF --> Блок с информацией: <div id="tab1" class="tab_content"> первый контейнер </div>
|
|
|
|
|
 |
|
|
Администратор |
 |
Стаж: 9 лет 4 месяца 20 дней Сообщения: 1235 Откуда: здешние мы
Стиль: subsilver2
Репутация: 11
перейти на сайт пользователя
Найти темы пользователя
|
1. в названии блока прописывается не ссылка, а именно название. то есть Код: Выделить всё {L_WHO_IS_ONLINE} - кто сейчас на конференции
{L_STATISTICS} - статистика
{L_BIRTHDAYS} - дни рождения прописывается Код: Выделить всё <span><a class="" href="#tab1"><b>{L_WHO_IS_ONLINE}</b></a></span> а в блок вставляется именно информация вывода то есть для этой ссылки это будет (напишу для сабсилвера, можно просто заменить. это - для примера). Код: Выделить всё <!-- IF S_DISPLAY_ONLINE_LIST -->
<table class="tablebg" width="100%" cellspacing="1"> <tr> <td class="row1" colspan="2"><!-- IF U_VIEWONLINE --><h4><a href="{U_VIEWONLINE}">{L_WHO_IS_ONLINE}</a></h4><!-- ELSE --><h4>{L_WHO_IS_ONLINE}</h4><!-- ENDIF --></td> </tr> <tr> <!-- IF LEGEND --> <td class="row1" rowspan="2" align="center"><img src="{T_THEME_PATH}/images/network.png" alt="{L_WHO_IS_ONLINE}" /></td> <!-- ELSE --> <td class="row1" align="center"><img src="{T_THEME_PATH}/images/network.png" alt="{L_WHO_IS_ONLINE}" /></td> <!-- ENDIF --> <td class="row1" width="100%"><span class="genmed">{TOTAL_USERS_ONLINE} ({L_ONLINE_EXPLAIN})<br />{RECORD_USERS}<br /><br />{LOGGED_IN_USER_LIST}</span></td> </tr> <!-- IF LEGEND --> <!--<tr> <td class="row1"><b class="gensmall">{L_LEGEND} :: {LEGEND}</b></td> </tr>--> <!-- ENDIF --> </table> <!-- ENDIF --> то есть сам блок с этим выводом будет таким: Код: Выделить всё <div id="tab1" class="tab_content"> <!-- IF S_DISPLAY_ONLINE_LIST -->
<table class="tablebg" width="100%" cellspacing="1"> <tr> <td class="row1" colspan="2"><!-- IF U_VIEWONLINE --><h4><a href="{U_VIEWONLINE}">{L_WHO_IS_ONLINE}</a></h4><!-- ELSE --><h4>{L_WHO_IS_ONLINE}</h4><!-- ENDIF --></td> </tr> <tr> <!-- IF LEGEND --> <td class="row1" rowspan="2" align="center"><img src="{T_THEME_PATH}/images/network.png" alt="{L_WHO_IS_ONLINE}" /></td> <!-- ELSE --> <td class="row1" align="center"><img src="{T_THEME_PATH}/images/network.png" alt="{L_WHO_IS_ONLINE}" /></td> <!-- ENDIF --> <td class="row1" width="100%"><span class="genmed">{TOTAL_USERS_ONLINE} ({L_ONLINE_EXPLAIN})<br />{RECORD_USERS}<br /><br />{LOGGED_IN_USER_LIST}</span></td> </tr> <!-- IF LEGEND --> <!--<tr> <td class="row1"><b class="gensmall">{L_LEGEND} :: {LEGEND}</b></td> </tr>--> <!-- ENDIF --> </table> <!-- ENDIF --> </div>
как-то так... добавлю: условие для открытия можно прописывать как для всей ссылки, чтобы можно было показывать/не показывать её и информацию её блока. то есть (для дней рождения): Код: Выделить всё <!-- IF S_DISPLAY_BIRTHDAY_LIST --><span><a class="" href="#tab1"><b>{L_BIRTHDAYS}</b></a></span><!-- ENDIF --> то есть вся ссылка обёрнута в условие. и при запрете показа дней рождения её просто никто не увидит...
|
|
трёхголовый белк семейства рептилоидов: "три головы - хорошо, на как же трудно придти к согласию..."
|
|
|
 |
|
|
Стаж: 8 лет 29 дней Сообщения: 741
Стиль: prosilver
Репутация: 15
перейти на сайт пользователя
Найти темы пользователя
|
Я чего то вообще жестко туплю с этим скриптом. Если я правильно понимаю, то первая ячейка для КТО СЕЙЧАС НА КОНФЕРЕНЦИИ для стиля просильвер будет выглядеть так: Код: Выделить всё <span><a class="" href="#tab1"><b><!-- IF U_WATCH_TOPIC --></b></a></span> а блок вывода так: Код: Выделить всё <!-- IF U_WATCH_TOPIC --><li <!-- IF S_WATCHING_TOPIC -->class="icon-unsubscribe"<!-- ELSE -->class="icon-subscribe"<!-- ENDIF -->><a href="{U_WATCH_TOPIC}" title="{L_WATCH_TOPIC}">{L_WATCH_TOPIC}</a></li><!-- ENDIF --> верно? Добавлено спустя 3 минуты 2 секунды:Хотелось бы еще обнаглеть и красивые кнопочки сделать.  Странно, почему Вы их не сделали у себя, Андрей.  Смотрелось бы лучше чем просто ссылки, на мой взгляд. 
|
|
|
|
|
 |
|
|
Администратор |
 |
Стаж: 9 лет 4 месяца 20 дней Сообщения: 1235 Откуда: здешние мы
Стиль: subsilver2
Репутация: 11
перейти на сайт пользователя
Найти темы пользователя
|
нет. Код: Выделить всё {L_WHO_IS_ONLINE} - кто сейчас на конференции ссылка будет выглядеть так: Код: Выделить всё <span><a class="" href="#tab1"><b>{L_WHO_IS_ONLINE}</b></a></span> эта строка - начало условия. и ещё оно без закрывающего тэга <!-- ENDIF -->. сразу получится ошибка. а в контейнер div надо прописать код Код: Выделить всё <!-- IF S_DISPLAY_ONLINE_LIST --> <!-- IF U_VIEWONLINE --><h3><a href="{U_VIEWONLINE}">{L_WHO_IS_ONLINE}</a></h3><!-- ELSE --><h3>{L_WHO_IS_ONLINE}</h3><!-- ENDIF --> <p>{TOTAL_USERS_ONLINE} ({L_ONLINE_EXPLAIN})<br />{RECORD_USERS}<br /> <br />{LOGGED_IN_USER_LIST} <!-- IF LEGEND --><br /><em>{L_LEGEND}: {LEGEND}</em><!-- ENDIF --></p> <!-- ENDIF --> так как здесь есть условие - можно и ссылку "обернуть" в него. тогда ссылка будет выглядеть так: Код: Выделить всё <!-- IF S_DISPLAY_ONLINE_LIST --><span><a class="" href="#tab1"><b>{L_WHO_IS_ONLINE}</b></a></span><!-- ENDIF -->
 Странно, почему Вы их не сделали у себя, Андрей.
где не сделал? в этой теме? здесь предоставляется для обзора "голый" код перебора, каждый может оформить его вид как захочет.
|
|
трёхголовый белк семейства рептилоидов: "три головы - хорошо, на как же трудно придти к согласию..."
|
|
|
 |
|
|
Стаж: 8 лет 29 дней Сообщения: 741
Стиль: prosilver
Репутация: 15
перейти на сайт пользователя
Найти темы пользователя
|
 L_WHO_IS_ONLINE
У меня в файле overall_footer.html эта часть отсутствует эта часть кода что обозначает? У меня и этого нет: IF U_VIEWONLINE и этого L_ONLINE_EXPLAIN  и даже этого: <!-- IF LEGEND --> Судя по всему на просильвере вывод отличается и название функций тоже
 где не сделал? в этой теме? здесь предоставляется для обзора "голый" код перебора, каждый может оформить его вид как захочет.
не, не. Я имею в виду на главной странице в вас вывод по вкладкам реализован в виде ссылок: | Кто сейчас на сайте || Статистика || Дни рождения || Кто сегодня был на сайте || Топ 5 Национальных флагов || Инфор по сайту | А можно было бы сделать в виде кнопок. Добавлено спустя 5 минут 37 секунд:У меня вывод стандартный в просильвере такой: Код: Выделить всё <div id="page-footer">
<div class="navbar"> <div class="inner"><span class="corners-top"><span></span></span>
<ul class="linklist"> <li class="icon-home"><a href="{U_INDEX}" accesskey="h">{L_INDEX}</a></li> <!-- IF not S_IS_BOT --> <!-- IF S_WATCH_FORUM_LINK --><li <!-- IF S_WATCHING_FORUM -->class="icon-unsubscribe"<!-- ELSE -->class="icon-subscribe"<!-- ENDIF -->><a href="{S_WATCH_FORUM_LINK}" title="{S_WATCH_FORUM_TITLE}">{S_WATCH_FORUM_TITLE}</a></li><!-- ENDIF --> <!-- IF U_WATCH_TOPIC --><li <!-- IF S_WATCHING_TOPIC -->class="icon-unsubscribe"<!-- ELSE -->class="icon-subscribe"<!-- ENDIF -->><a href="{U_WATCH_TOPIC}" title="{L_WATCH_TOPIC}">{L_WATCH_TOPIC}</a></li><!-- ENDIF --> <!-- IF U_BOOKMARK_TOPIC --><li class="icon-bookmark"><a href="{U_BOOKMARK_TOPIC}" title="{L_BOOKMARK_TOPIC}">{L_BOOKMARK_TOPIC}</a></li><!-- ENDIF --> <!-- IF U_BUMP_TOPIC --><li class="icon-bump"><a href="{U_BUMP_TOPIC}" title="{L_BUMP_TOPIC}">{L_BUMP_TOPIC}</a></li><!-- ENDIF --> <!-- ENDIF --> <li class="rightside"><!-- IF not S_IS_BOT --><a href="{U_MOBILE_ON}">{L_MOBILE_ON}</a> • <!-- ENDIF --><!-- IF U_TEAM --><a href="{U_TEAM}">{L_THE_TEAM}</a> • <!-- ENDIF --><!-- IF not S_IS_BOT --><a href="{U_DELETE_COOKIES}">{L_DELETE_COOKIES}</a> • <!-- ENDIF -->{S_TIMEZONE}</li> </ul>
<span class="corners-bottom"><span></span></span></div> </div>
|
|
|
|
|
 |
|
|
Администратор |
 |
Стаж: 9 лет 4 месяца 20 дней Сообщения: 1235 Откуда: здешние мы
Стиль: subsilver2
Репутация: 11
перейти на сайт пользователя
Найти темы пользователя
|
 У меня в файле overall_footer.html эта часть
вся эта лабуда находится и выводится в файле index_body.htmlвсё это у вас есть. я приводил примеры с чистого просилвера. кстати, добавил в начало темы демо-версии скрипта с оформлением в виде анимированных кнопок.
|
|
трёхголовый белк семейства рептилоидов: "три головы - хорошо, на как же трудно придти к согласию..."
|
|
|
 |
|
|
Стаж: 8 лет 29 дней Сообщения: 741
Стиль: prosilver
Репутация: 15
перейти на сайт пользователя
Найти темы пользователя
|
а, вон оно чего  Пошел разбираться. За кнопочки отдельное спасибо  Класс! Добавлено спустя 2 минуты 29 секунд:Я правильно понимаю, что этот скрипт надо добавить в файл index_body.html, отредактировав его соответствующим образом Добавлено спустя 4 минуты 36 секунд:Ну вроде понятно, как то так: Код: Выделить всё <ul class="tabs"> <span><a class="button button-blue" href="#tab1">{L_WHO_IS_ONLINE}</a></span> <span><a class="button button-blue" href="#tab2">вторая ссылка</a></span> <span><a class="button button-blue" href="#tab3">третья ссылка</a></span> <span><a class="button button-blue" style="float:right;" href="#tab4">четвёртая ссылка</a></span> </ul>
<div id="tab1" class="tab_content"> <br /><!-- IF S_DISPLAY_ONLINE_LIST --> <!-- IF S_DISPLAY_ONLINE_LIST --> <!-- IF U_VIEWONLINE --><h3><a href="{U_VIEWONLINE}">{L_WHO_IS_ONLINE}</a></h3><!-- ELSE --><h3>{L_WHO_IS_ONLINE}</h3><!-- ENDIF --> <p>{TOTAL_USERS_ONLINE} ({L_ONLINE_EXPLAIN})<br />{RECORD_USERS}<br /> <br />{LOGGED_IN_USER_LIST} <!-- IF LEGEND --><br /><em>{L_LEGEND}: {LEGEND}</em><!-- ENDIF --></p> <!-- ENDIF --> </div> Добавлено спустя 2 минуты 2 секунды:Пойду попробую. На всякий оставлю тут свой файл, ДО: Код: Выделить всё <!-- INCLUDE overall_header.html --> <!-- new info block on --> <table width="100%"> <tr> <td width="30%" align="left"> <!-- IF U_MCP --><a href="{U_MCP}" title="{L_MCP}"><img src="{T_THEME_PATH}/images/001.png" alt="{L_MCP}" style="margin:0 20px 0 0;" /></a><!-- ENDIF --> <!-- IF S_DISPLAY_SEARCH or (S_USER_LOGGED_IN and not S_IS_BOT) --> <!-- IF S_DISPLAY_SEARCH --><a href="{U_SEARCH_ACTIVE_TOPICS}" title="{L_SEARCH_ACTIVE_TOPICS}"><img src="{T_THEME_PATH}/images/002.png" alt="{L_SEARCH_ACTIVE_TOPICS}" style="margin:0 20px 0 0;" /></a> <!-- IF S_USER_LOGGED_IN or S_LOAD_UNREADS --><!-- IF S_LOAD_UNREADS --><a href="{U_SEARCH_UNREAD}" title="{L_SEARCH_UNREAD}"><img src="{T_THEME_PATH}/images/004.png" alt="{L_SEARCH_UNREAD}" style="margin:0 20px 0 0;" /></a><!-- ENDIF --><!-- ENDIF --> <!-- ENDIF --> <!-- IF not S_IS_BOT and U_MARK_FORUMS --><a href="{U_MARK_FORUMS}" accesskey="m" title="{L_MARK_FORUMS_READ}"><img src="{T_THEME_PATH}/images/003.png" alt="{L_MARK_FORUMS_READ}" style="margin:0 20px 0 0;" /></a><!-- ENDIF --> <!-- ENDIF --> </td> <td width="30%" align="center" valign="middle"><p>{CURRENT_TIME}</p></td> <td width="30%"> </td> </tr> </table> <!-- new info block off --> <!-- IF RECENT_TOPICS_DISPLAY --><!-- INCLUDE recent_topics_body.html --><!-- ENDIF -->
<!-- INCLUDE gallery/imageblock_body.html --> <!-- INCLUDE forumlist_body.html -->
<!-- IF not S_USER_LOGGED_IN and not S_IS_BOT --> <form method="post" action="{S_LOGIN_ACTION}" class="headerspace"> <h3><a href="{U_LOGIN_LOGOUT}">{L_LOGIN_LOGOUT}</a><!-- IF S_REGISTER_ENABLED --> • <a href="{U_REGISTER}">{L_REGISTER}</a><!-- ENDIF --></h3> <fieldset class="quick-login"> <label for="username">{L_USERNAME}:</label> <input type="text" name="username" id="username" size="10" class="inputbox" title="{L_USERNAME}" /> <label for="password">{L_PASSWORD}:</label> <input type="password" name="password" id="password" size="10" class="inputbox" title="{L_PASSWORD}" /> <!-- IF S_AUTOLOGIN_ENABLED --> | <label for="autologin">{L_LOG_ME_IN} <input type="checkbox" name="autologin" id="autologin" /></label> <!-- ENDIF --> <input type="submit" name="login" value="{L_LOGIN}" class="button2" /> {S_LOGIN_REDIRECT} </fieldset> </form> <!-- ENDIF -->
<!-- IF S_DISPLAY_ONLINE_LIST --> <!-- IF U_VIEWONLINE --><h3><a href="{U_VIEWONLINE}">{L_WHO_IS_ONLINE}</a></h3><!-- ELSE --><h3>{L_WHO_IS_ONLINE}</h3><!-- ENDIF --> <p>{TOTAL_USERS_ONLINE} ({L_ONLINE_EXPLAIN})<br />{RECORD_USERS}<br /> <br />{LOGGED_IN_USER_LIST} <!-- IF LEGEND --><br /><em>{L_LEGEND}: {LEGEND}</em><!-- ENDIF --></p> <!-- ENDIF -->
<!-- IF S_DISPLAY_BIRTHDAY_LIST and BIRTHDAY_LIST --> <h3>{L_BIRTHDAYS}</h3> <p><!-- IF BIRTHDAY_LIST -->{L_CONGRATULATIONS}: <strong>{BIRTHDAY_LIST}</strong><!-- ELSE -->{L_NO_BIRTHDAYS}<!-- ENDIF --></p> <!-- ENDIF -->
<!-- IF S_THANKS_LIST --> <h3>{L_TOP_THANKS_LIST}</h3> <p>{THANKS_LIST}</p> <!-- ENDIF --> <!-- IF NEWEST_USER --> <h3>{L_STATISTICS}</h3> <p>{TOTAL_POSTS} • {TOTAL_TOPICS} <!-- IF TOTAL_IMAGES --> • {TOTAL_IMAGES}<!-- ENDIF --> • {TOTAL_USERS} • {NEWEST_USER}</p> <!-- ENDIF -->
<!-- INCLUDE overall_footer.html -->
|
|
|
|
|
 |
|
|
Администратор |
 |
Стаж: 9 лет 4 месяца 20 дней Сообщения: 1235 Откуда: здешние мы
Стиль: subsilver2
Репутация: 11
перейти на сайт пользователя
Найти темы пользователя
|
можете кнопки тоже в условие обернуть. тогда они не будут выводиться, если эта функция будет выключена, то есть для вашей первой это будет Код: Выделить всё <!-- IF S_DISPLAY_ONLINE_LIST --><span><a class="button button-blue" href="#tab1">{L_WHO_IS_ONLINE}</a></span><!-- ENDIF --> удачи.
|
|
трёхголовый белк семейства рептилоидов: "три головы - хорошо, на как же трудно придти к согласию..."
|
|
|
 |
|
|
Стаж: 8 лет 29 дней Сообщения: 741
Стиль: prosilver
Репутация: 15
перейти на сайт пользователя
Найти темы пользователя
|
Что то я намутил не то. Ошибка 500 и белый экран  Сейчас попробую в блокноте сделать и покажу как это у меня выглядит Добавлено спустя 5 минут 24 секунды:Вот мой обновленный файл, который выдал ошибку 500 Код: Выделить всё <!-- INCLUDE overall_header.html --> <!-- new info block on --> <table width="100%"> <tr> <td width="30%" align="left"> <!-- IF U_MCP --><a href="{U_MCP}" title="{L_MCP}"><img src="{T_THEME_PATH}/images/001.png" alt="{L_MCP}" style="margin:0 20px 0 0;" /></a><!-- ENDIF --> <!-- IF S_DISPLAY_SEARCH or (S_USER_LOGGED_IN and not S_IS_BOT) --> <!-- IF S_DISPLAY_SEARCH --><a href="{U_SEARCH_ACTIVE_TOPICS}" title="{L_SEARCH_ACTIVE_TOPICS}"><img src="{T_THEME_PATH}/images/002.png" alt="{L_SEARCH_ACTIVE_TOPICS}" style="margin:0 20px 0 0;" /></a> <!-- IF S_USER_LOGGED_IN or S_LOAD_UNREADS --><!-- IF S_LOAD_UNREADS --><a href="{U_SEARCH_UNREAD}" title="{L_SEARCH_UNREAD}"><img src="{T_THEME_PATH}/images/004.png" alt="{L_SEARCH_UNREAD}" style="margin:0 20px 0 0;" /></a><!-- ENDIF --><!-- ENDIF --> <!-- ENDIF --> <!-- IF not S_IS_BOT and U_MARK_FORUMS --><a href="{U_MARK_FORUMS}" accesskey="m" title="{L_MARK_FORUMS_READ}"><img src="{T_THEME_PATH}/images/003.png" alt="{L_MARK_FORUMS_READ}" style="margin:0 20px 0 0;" /></a><!-- ENDIF --> <!-- ENDIF --> </td> <td width="30%" align="center" valign="middle"><p>{CURRENT_TIME}</p></td> <td width="30%"> </td> </tr> </table> <!-- new info block off --> <!-- IF RECENT_TOPICS_DISPLAY --><!-- INCLUDE recent_topics_body.html --><!-- ENDIF -->
<!-- INCLUDE gallery/imageblock_body.html --> <!-- INCLUDE forumlist_body.html -->
<!-- IF not S_USER_LOGGED_IN and not S_IS_BOT --> <form method="post" action="{S_LOGIN_ACTION}" class="headerspace"> <h3><a href="{U_LOGIN_LOGOUT}">{L_LOGIN_LOGOUT}</a><!-- IF S_REGISTER_ENABLED --> • <a href="{U_REGISTER}">{L_REGISTER}</a><!-- ENDIF --></h3> <fieldset class="quick-login"> <label for="username">{L_USERNAME}:</label> <input type="text" name="username" id="username" size="10" class="inputbox" title="{L_USERNAME}" /> <label for="password">{L_PASSWORD}:</label> <input type="password" name="password" id="password" size="10" class="inputbox" title="{L_PASSWORD}" /> <!-- IF S_AUTOLOGIN_ENABLED --> | <label for="autologin">{L_LOG_ME_IN} <input type="checkbox" name="autologin" id="autologin" /></label> <!-- ENDIF --> <input type="submit" name="login" value="{L_LOGIN}" class="button2" /> {S_LOGIN_REDIRECT} </fieldset> </form> <!-- ENDIF -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/JavaScript"> $(document).ready(function() {
//Действие по умолчанию $(".tab_content").hide(); //Скрыть все содержимое $("ul.tabs span:first").addClass("active").show(); //Активировать первую вкладку $(".tab_content:first").show(); //Показать первые содержание вкладке //По щелчку события $("ul.tabs span").click(function() { $("ul.tabs span").removeClass("active"); //Удалите все "active" класс $(this).addClass("active"); //Добавить "active" класса выбранной вкладки $(".tab_content").hide(); //Скрыть вкладку Все содержание var activeTab = $(this).find("a").attr("href"); //Найти относительной значение атрибута для выявления активной вкладки + содержание $(activeTab).fadeIn(); //Fade в активного содержимого return false; });
}); </script> </head> <body>
<style> .tab_content{height:150px;padding:10px;margin-right:-4px;;background-color:#FFFFFF;border:1px solid #4477a1;} .tabs{width:100%;list-style:none;margin:0;padding:0 2px;height:26px;background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1) );background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .button{float:left;margin:2px;padding:2px 4px 2px 4px;text-decoration:none;font-family:"Lucida Grande", Verdana, Helvetica, Arial, sans-serif;font-weight:normal;font-size:14px;display:inline-block;text-align:center;_border:1px solid #ffffff;text-shadow:0 1px 0 rgba(0,0,0,0.4);box-shadow:0 0 .05em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .05em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .05em rgba(0,0,0,0.4);} .button:hover{box-shadow:0 0 .1em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .1em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .1em rgba(0,0,0,0.4);} .button:active{position:relative;top:1px;} a.button{color:#FFFFFF;} .button-blue{background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1));background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .button-blue:hover{background:#81a8cb;background:-webkit-gradient(linear, left top, left bottom, from(#4477a1), to(#81a8cb));background:-moz-linear-gradient(-90deg, #4477a1, #81a8cb);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4477a1', endColorstr='#81a8cb');} .button-blue:active{background:#4477a1;} </style> <ul class="tabs"> <span><a class="button button-blue" href="#tab1">{L_WHO_IS_ONLINE}</a></span> <span><a class="button button-blue" href="#tab2">{L_BIRTHDAYS}</a></span> <span><a class="button button-blue" href="#tab3">{L_TOP_THANKS_LIST}</a></span> <span><a class="button button-blue" style="float:right;" href="#tab4">{L_STATISTICS}</a></span> </ul>
<div id="tab1" class="tab_content"> <br /> <!-- IF S_DISPLAY_ONLINE_LIST --> <!-- IF U_VIEWONLINE --><h3><a href="{U_VIEWONLINE}">{L_WHO_IS_ONLINE}</a></h3><!-- ELSE --><h3>{L_WHO_IS_ONLINE}</h3><!-- ENDIF --> <p>{TOTAL_USERS_ONLINE} ({L_ONLINE_EXPLAIN})<br />{RECORD_USERS}<br /> <br />{LOGGED_IN_USER_LIST} <!-- IF LEGEND --><br /><em>{L_LEGEND}: {LEGEND}</em><!-- ENDIF --></p> <!-- ENDIF --> </div> <div id="tab2" class="tab_content"> <br /><!-- IF S_DISPLAY_BIRTHDAY_LIST and BIRTHDAY_LIST --> <h3>{L_BIRTHDAYS}</h3> <p><!-- IF BIRTHDAY_LIST -->{L_CONGRATULATIONS}: <strong>{BIRTHDAY_LIST}</strong><!-- ELSE -->{L_NO_BIRTHDAYS}<!-- ENDIF --></p> <!-- ENDIF --> </div> <div id="tab3" class="tab_content"> <br /><!-- IF S_THANKS_LIST --> <h3>{L_TOP_THANKS_LIST}</h3> <p>{THANKS_LIST}</p> <!-- ENDIF --> </div> <div id="tab4" class="tab_content"> <br /><!-- IF NEWEST_USER --> <h3>{L_STATISTICS}</h3> <p>{TOTAL_POSTS} • {TOTAL_TOPICS} <!-- IF TOTAL_IMAGES --> • {TOTAL_IMAGES}<!-- ENDIF --> • {TOTAL_USERS} • {NEWEST_USER}</p> <!-- ENDIF --> </div>
<!-- INCLUDE overall_footer.html --> Добавлено спустя 13 минут 24 секунды:Или, все же, надо в обертку делать: Код: Выделить всё <ul class="tabs"> <!-- IF S_DISPLAY_ONLINE_LIST --><span><a class="button button-blue" href="#tab1">{L_WHO_IS_ONLINE}</a></span><!-- ENDIF -->
<!-- IF S_DISPLAY_BIRTHDAY_LIST and BIRTHDAY_LIST --><span><a class="button button-blue" href="#tab2">{L_BIRTHDAYS}</a></span><!-- ENDIF -->
<!-- IF S_THANKS_LIST --><span><a class="button button-blue" href="#tab3">{L_TOP_THANKS_LIST}</a></span><!-- ENDIF -->
<!-- IF NEWEST_USER --><span><a class="button button-blue" style="float:right;" href="#tab4">{L_STATISTICS}</a></span> </ul><!-- ENDIF -->
|
|
|
|
|
 |
|
|
Администратор |
 |
Стаж: 9 лет 4 месяца 20 дней Сообщения: 1235 Откуда: здешние мы
Стиль: subsilver2
Репутация: 11
перейти на сайт пользователя
Найти темы пользователя
|
само собой. недо ведь код встраивать, а не целую html-страницу. для примера создана отдельная страница. c <html>, <body>... вам же нужен только код. то есть: проверьте, есть ли у вас в шапке (overall_header.html) код аодключения библотеки Код: Выделить всё <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> если нет - пропишите его там перед </head> дальше. этот код (самой кнопки) у вас уже точно есть и прописывать его заново смыла нет (будут совпадения и ошибки чтения) Код: Выделить всё .button{float:left;margin:2px;padding:2px 4px 2px 4px;text-decoration:none;font-family:"Lucida Grande", Verdana, Helvetica, Arial, sans-serif;font-weight:normal;font-size:14px;display:inline-block;text-align:center;_border:1px solid #ffffff;text-shadow:0 1px 0 rgba(0,0,0,0.4);box-shadow:0 0 .05em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .05em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .05em rgba(0,0,0,0.4);} .button:hover{box-shadow:0 0 .1em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .1em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .1em rgba(0,0,0,0.4);} .button:active{position:relative;top:1px;} a.button{color:#FFFFFF;} .button-blue{background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1));background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .button-blue:hover{background:#81a8cb;background:-webkit-gradient(linear, left top, left bottom, from(#4477a1), to(#81a8cb));background:-moz-linear-gradient(-90deg, #4477a1, #81a8cb);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4477a1', endColorstr='#81a8cb');} .button-blue:active{background:#4477a1;} теперь выкинув из кода перебора всё лишнее, получим ваш файл: Код: Выделить всё <!-- INCLUDE overall_header.html --> <!-- new info block on --> <table width="100%"> <tr> <td width="30%" align="left"> <!-- IF U_MCP --><a href="{U_MCP}" title="{L_MCP}"><img src="{T_THEME_PATH}/images/001.png" alt="{L_MCP}" style="margin:0 20px 0 0;" /></a><!-- ENDIF --> <!-- IF S_DISPLAY_SEARCH or (S_USER_LOGGED_IN and not S_IS_BOT) --> <!-- IF S_DISPLAY_SEARCH --><a href="{U_SEARCH_ACTIVE_TOPICS}" title="{L_SEARCH_ACTIVE_TOPICS}"><img src="{T_THEME_PATH}/images/002.png" alt="{L_SEARCH_ACTIVE_TOPICS}" style="margin:0 20px 0 0;" /></a> <!-- IF S_USER_LOGGED_IN or S_LOAD_UNREADS --><!-- IF S_LOAD_UNREADS --><a href="{U_SEARCH_UNREAD}" title="{L_SEARCH_UNREAD}"><img src="{T_THEME_PATH}/images/004.png" alt="{L_SEARCH_UNREAD}" style="margin:0 20px 0 0;" /></a><!-- ENDIF --><!-- ENDIF --> <!-- ENDIF --> <!-- IF not S_IS_BOT and U_MARK_FORUMS --><a href="{U_MARK_FORUMS}" accesskey="m" title="{L_MARK_FORUMS_READ}"><img src="{T_THEME_PATH}/images/003.png" alt="{L_MARK_FORUMS_READ}" style="margin:0 20px 0 0;" /></a><!-- ENDIF --> <!-- ENDIF --> </td> <td width="30%" align="center" valign="middle"><p>{CURRENT_TIME}</p></td> <td width="30%"> </td> </tr> </table> <!-- new info block off --> <!-- IF RECENT_TOPICS_DISPLAY --><!-- INCLUDE recent_topics_body.html --><!-- ENDIF -->
<!-- INCLUDE gallery/imageblock_body.html --> <!-- INCLUDE forumlist_body.html -->
<!-- IF not S_USER_LOGGED_IN and not S_IS_BOT --> <form method="post" action="{S_LOGIN_ACTION}" class="headerspace"> <h3><a href="{U_LOGIN_LOGOUT}">{L_LOGIN_LOGOUT}</a><!-- IF S_REGISTER_ENABLED --> • <a href="{U_REGISTER}">{L_REGISTER}</a><!-- ENDIF --></h3> <fieldset class="quick-login"> <label for="username">{L_USERNAME}:</label> <input type="text" name="username" id="username" size="10" class="inputbox" title="{L_USERNAME}" /> <label for="password">{L_PASSWORD}:</label> <input type="password" name="password" id="password" size="10" class="inputbox" title="{L_PASSWORD}" /> <!-- IF S_AUTOLOGIN_ENABLED --> | <label for="autologin">{L_LOG_ME_IN} <input type="checkbox" name="autologin" id="autologin" /></label> <!-- ENDIF --> <input type="submit" name="login" value="{L_LOGIN}" class="button2" /> {S_LOGIN_REDIRECT} </fieldset> </form> <!-- ENDIF -->
<script type="text/JavaScript"> $(document).ready(function() {
//Действие по умолчанию $(".tab_content").hide(); //Скрыть все содержимое $("ul.tabs span:first").addClass("active").show(); //Активировать первую вкладку $(".tab_content:first").show(); //Показать первые содержание вкладке //По щелчку события $("ul.tabs span").click(function() { $("ul.tabs span").removeClass("active"); //Удалите все "active" класс $(this).addClass("active"); //Добавить "active" класса выбранной вкладки $(".tab_content").hide(); //Скрыть вкладку Все содержание var activeTab = $(this).find("a").attr("href"); //Найти относительной значение атрибута для выявления активной вкладки + содержание $(activeTab).fadeIn(); //Fade в активного содержимого return false; });
}); </script>
<style> .tab_content{height:150px;padding:10px;margin-right:-4px;;background-color:#FFFFFF;border:1px solid #4477a1;} .tabs{width:100%;list-style:none;margin:0;padding:0 2px;height:26px;background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1) );background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} </style> <ul class="tabs"> <span><a class="button button-blue" href="#tab1">{L_WHO_IS_ONLINE}</a></span> <span><a class="button button-blue" href="#tab2">{L_BIRTHDAYS}</a></span> <span><a class="button button-blue" href="#tab3">{L_TOP_THANKS_LIST}</a></span> <span><a class="button button-blue" style="float:right;" href="#tab4">{L_STATISTICS}</a></span> </ul>
<div id="tab1" class="tab_content"> <br /> <!-- IF S_DISPLAY_ONLINE_LIST --> <!-- IF U_VIEWONLINE --><h3><a href="{U_VIEWONLINE}">{L_WHO_IS_ONLINE}</a></h3><!-- ELSE --><h3>{L_WHO_IS_ONLINE}</h3><!-- ENDIF --> <p>{TOTAL_USERS_ONLINE} ({L_ONLINE_EXPLAIN})<br />{RECORD_USERS}<br /> <br />{LOGGED_IN_USER_LIST} <!-- IF LEGEND --><br /><em>{L_LEGEND}: {LEGEND}</em><!-- ENDIF --></p> <!-- ENDIF --> </div> <div id="tab2" class="tab_content"> <br /><!-- IF S_DISPLAY_BIRTHDAY_LIST and BIRTHDAY_LIST --> <h3>{L_BIRTHDAYS}</h3> <p><!-- IF BIRTHDAY_LIST -->{L_CONGRATULATIONS}: <strong>{BIRTHDAY_LIST}</strong><!-- ELSE -->{L_NO_BIRTHDAYS}<!-- ENDIF --></p> <!-- ENDIF --> </div> <div id="tab3" class="tab_content"> <br /><!-- IF S_THANKS_LIST --> <h3>{L_TOP_THANKS_LIST}</h3> <p>{THANKS_LIST}</p> <!-- ENDIF --> </div> <div id="tab4" class="tab_content"> <br /><!-- IF NEWEST_USER --> <h3>{L_STATISTICS}</h3> <p>{TOTAL_POSTS} • {TOTAL_TOPICS} <!-- IF TOTAL_IMAGES --> • {TOTAL_IMAGES}<!-- ENDIF --> • {TOTAL_USERS} • {NEWEST_USER}</p> <!-- ENDIF --> </div>
<!-- INCLUDE overall_footer.html --> как-то так...
|
|
трёхголовый белк семейства рептилоидов: "три головы - хорошо, на как же трудно придти к согласию..."
|
|
|
 |
|
|
Стаж: 8 лет 29 дней Сообщения: 741
Стиль: prosilver
Репутация: 15
перейти на сайт пользователя
Найти темы пользователя
|
Вот жеж.  Это надо понимать, где скрипт подключать надо. Пошел пробовать  Спасибо! Добавлено спустя 13 минут 36 секунд:Почти получилось! Выглядит это так:  Почему то кнопочки не отобразились  Хотя они у меня действительно прописаны и меню из них верхнее, и кнопки в постах Еще пробел бы убрать, он явно лишний. А скруглить этот блок можно же тут, да? Код: Выделить всё <style> .tab_content{height:150px;padding:10px;margin-right:-4px;;background-color:#FFFFFF;border:1px solid #4477a1;} .tabs{width:100%;list-style:none;margin:0;padding:0 2px;height:26px;background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1) );background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} </style> а именно добавить border-radius: 5px; сюда Код: Выделить всё .tab_content{height:150px;padding:10px;margin-right:-4px;;background-color:#FFFFFF;border:1px solid #4477a1; border-radius: 5px;} Верно? :)
|
|
|
|
|
 |
|
|
Администратор |
 |
Стаж: 9 лет 4 месяца 20 дней Сообщения: 1235 Откуда: здешние мы
Стиль: subsilver2
Репутация: 11
перейти на сайт пользователя
Найти темы пользователя
|
кнопки отобразились. просто синие на синем фоне. добавьте в код ссылок белый цвет: Код: Выделить всё <ul class="tabs"> <span><a class="button button-blue" href="#tab1" style="color:white;">{L_WHO_IS_ONLINE}</a></span> <span><a class="button button-blue" href="#tab2" style="color:white;">{L_BIRTHDAYS}</a></span> <span><a class="button button-blue" href="#tab3" style="color:white;">{L_TOP_THANKS_LIST}</a></span> <span><a class="button button-blue" style="float:right;color:white;" href="#tab4">{L_STATISTICS}</a></span> </ul> Добавлено спустя 5 минут 31 секунду:а можете просто другой код прописать этих кнопок (обозвать по другому). тогда они не будут конфликтовать с предыдущими выводами... ваш полный код: Код: Выделить всё <!-- INCLUDE overall_header.html --> <!-- new info block on --> <table width="100%"> <tr> <td width="30%" align="left"> <!-- IF U_MCP --><a href="{U_MCP}" title="{L_MCP}"><img src="{T_THEME_PATH}/images/001.png" alt="{L_MCP}" style="margin:0 20px 0 0;" /></a><!-- ENDIF --> <!-- IF S_DISPLAY_SEARCH or (S_USER_LOGGED_IN and not S_IS_BOT) --> <!-- IF S_DISPLAY_SEARCH --><a href="{U_SEARCH_ACTIVE_TOPICS}" title="{L_SEARCH_ACTIVE_TOPICS}"><img src="{T_THEME_PATH}/images/002.png" alt="{L_SEARCH_ACTIVE_TOPICS}" style="margin:0 20px 0 0;" /></a> <!-- IF S_USER_LOGGED_IN or S_LOAD_UNREADS --><!-- IF S_LOAD_UNREADS --><a href="{U_SEARCH_UNREAD}" title="{L_SEARCH_UNREAD}"><img src="{T_THEME_PATH}/images/004.png" alt="{L_SEARCH_UNREAD}" style="margin:0 20px 0 0;" /></a><!-- ENDIF --><!-- ENDIF --> <!-- ENDIF --> <!-- IF not S_IS_BOT and U_MARK_FORUMS --><a href="{U_MARK_FORUMS}" accesskey="m" title="{L_MARK_FORUMS_READ}"><img src="{T_THEME_PATH}/images/003.png" alt="{L_MARK_FORUMS_READ}" style="margin:0 20px 0 0;" /></a><!-- ENDIF --> <!-- ENDIF --> </td> <td width="30%" align="center" valign="middle"><p>{CURRENT_TIME}</p></td> <td width="30%"> </td> </tr> </table> <!-- new info block off --> <!-- IF RECENT_TOPICS_DISPLAY --><!-- INCLUDE recent_topics_body.html --><!-- ENDIF -->
<!-- INCLUDE gallery/imageblock_body.html --> <!-- INCLUDE forumlist_body.html -->
<!-- IF not S_USER_LOGGED_IN and not S_IS_BOT --> <form method="post" action="{S_LOGIN_ACTION}" class="headerspace"> <h3><a href="{U_LOGIN_LOGOUT}">{L_LOGIN_LOGOUT}</a><!-- IF S_REGISTER_ENABLED --> • <a href="{U_REGISTER}">{L_REGISTER}</a><!-- ENDIF --></h3> <fieldset class="quick-login"> <label for="username">{L_USERNAME}:</label> <input type="text" name="username" id="username" size="10" class="inputbox" title="{L_USERNAME}" /> <label for="password">{L_PASSWORD}:</label> <input type="password" name="password" id="password" size="10" class="inputbox" title="{L_PASSWORD}" /> <!-- IF S_AUTOLOGIN_ENABLED --> | <label for="autologin">{L_LOG_ME_IN} <input type="checkbox" name="autologin" id="autologin" /></label> <!-- ENDIF --> <input type="submit" name="login" value="{L_LOGIN}" class="button2" /> {S_LOGIN_REDIRECT} </fieldset> </form> <!-- ENDIF -->
<script type="text/JavaScript"> $(document).ready(function() {
//Действие по умолчанию $(".tab_content").hide(); //Скрыть все содержимое $("ul.tabs span:first").addClass("active").show(); //Активировать первую вкладку $(".tab_content:first").show(); //Показать первые содержание вкладке //По щелчку события $("ul.tabs span").click(function() { $("ul.tabs span").removeClass("active"); //Удалите все "active" класс $(this).addClass("active"); //Добавить "active" класса выбранной вкладки $(".tab_content").hide(); //Скрыть вкладку Все содержание var activeTab = $(this).find("a").attr("href"); //Найти относительной значение атрибута для выявления активной вкладки + содержание $(activeTab).fadeIn(); //Fade в активного содержимого return false; });
}); </script>
<style> .tab_content{height:150px;padding:10px;margin-right:-4px;;background-color:#FFFFFF;border:1px solid #4477a1;} .tabs{width:100%;list-style:none;margin:0;padding:0 2px;height:26px;background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1) );background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .buttond{float:left;margin:2px;padding:2px 4px 2px 4px;text-decoration:none;font-family:"Lucida Grande", Verdana, Helvetica, Arial, sans-serif;font-weight:normal;font-size:14px;display:inline-block;text-align:center;_border:1px solid #ffffff;text-shadow:0 1px 0 rgba(0,0,0,0.4);box-shadow:0 0 .05em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .05em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .05em rgba(0,0,0,0.4);} .buttond:hover{box-shadow:0 0 .1em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .1em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .1em rgba(0,0,0,0.4);} .buttond:active{position:relative;top:1px;} a.buttond{color:#FFFFFF;} .buttond-blue{background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1));background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .buttond-blue:hover{background:#81a8cb;background:-webkit-gradient(linear, left top, left bottom, from(#4477a1), to(#81a8cb));background:-moz-linear-gradient(-90deg, #4477a1, #81a8cb);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4477a1', endColorstr='#81a8cb');} .buttond-blue:active{background:#4477a1;} </style> <ul class="tabs"> <span><a class="buttond buttond-blue" href="#tab1">{L_WHO_IS_ONLINE}</a></span> <span><a class="buttond buttond-blue" href="#tab2">{L_BIRTHDAYS}</a></span> <span><a class="buttond buttond-blue" href="#tab3">{L_TOP_THANKS_LIST}</a></span> <span><a class="buttond buttond-blue" style="float:right;" href="#tab4">{L_STATISTICS}</a></span> </ul>
<div id="tab1" class="tab_content"> <br /> <!-- IF S_DISPLAY_ONLINE_LIST --> <!-- IF U_VIEWONLINE --><h3><a href="{U_VIEWONLINE}">{L_WHO_IS_ONLINE}</a></h3><!-- ELSE --><h3>{L_WHO_IS_ONLINE}</h3><!-- ENDIF --> <p>{TOTAL_USERS_ONLINE} ({L_ONLINE_EXPLAIN})<br />{RECORD_USERS}<br /> <br />{LOGGED_IN_USER_LIST} <!-- IF LEGEND --><br /><em>{L_LEGEND}: {LEGEND}</em><!-- ENDIF --></p> <!-- ENDIF --> </div> <div id="tab2" class="tab_content"> <br /><!-- IF S_DISPLAY_BIRTHDAY_LIST and BIRTHDAY_LIST --> <h3>{L_BIRTHDAYS}</h3> <p><!-- IF BIRTHDAY_LIST -->{L_CONGRATULATIONS}: <strong>{BIRTHDAY_LIST}</strong><!-- ELSE -->{L_NO_BIRTHDAYS}<!-- ENDIF --></p> <!-- ENDIF --> </div> <div id="tab3" class="tab_content"> <br /><!-- IF S_THANKS_LIST --> <h3>{L_TOP_THANKS_LIST}</h3> <p>{THANKS_LIST}</p> <!-- ENDIF --> </div> <div id="tab4" class="tab_content"> <br /><!-- IF NEWEST_USER --> <h3>{L_STATISTICS}</h3> <p>{TOTAL_POSTS} • {TOTAL_TOPICS} <!-- IF TOTAL_IMAGES --> • {TOTAL_IMAGES}<!-- ENDIF --> • {TOTAL_USERS} • {NEWEST_USER}</p> <!-- ENDIF --> </div>
<!-- INCLUDE overall_footer.html --> ушёл по делам.
|
|
трёхголовый белк семейства рептилоидов: "три головы - хорошо, на как же трудно придти к согласию..."
|
|
|
 |
|
|
Стаж: 8 лет 29 дней Сообщения: 741
Стиль: prosilver
Репутация: 15
перейти на сайт пользователя
Найти темы пользователя
|
Ага, по второму варианту получилось.  Спасибо, Андрей! Только вот пробел убрать не могу тэги <p> по убирал - не помогло  Пробел явно лишний Скругление добавил. А что если эти кнопки прямо в блок засунуть, а? Тогда бы и накладок не было, и выглядело красиво Добавлено спустя 16 минут 35 секунд:Скруглил только нижние края + удалил дни рождения. Они выводятся сверху, когда они есть. Получилось очень даже красиво. Осталось только пробел/отступ грохнуть. Андрей, подскажи плз, если знаешь Добавлено спустя 12 минут 56 секунд:Хотел также спросить это фиксированный размер блока? А если будет больше пользователей во вкладке КТО СЕЙЧАС НА КОНФЕРЕНЦИИ. Он будет автоматом растягиваться? Такое впечатление, что все вкладки одинаковые по размеру блока и он определяется именно содержимым первой вкладки  P.S. Думаю еще перетащить кнопки из верхнего меню, в нижнее. Тут мне уже все понятно стало  Классная доработка. 
|
|
|
|
|
 |
|
|
Администратор |
 |
Стаж: 9 лет 4 месяца 20 дней Сообщения: 1235 Откуда: здешние мы
Стиль: subsilver2
Репутация: 11
перейти на сайт пользователя
Найти темы пользователя
|
 Осталось только пробел/отступ грохнуть.
из строки уберите <br />убрать с каждой. размер блока по длине - резиновый, по ширине - фиксированный. правится здесь: Код: Выделить всё .tab_content{height:150px;padding:10px;margin-right:-4px;;background-color:#FFFFFF;border:1px solid #4477a1;} можно попробовать написать min-height:150px;, тогда вроде долно быть фиксировано минимально 150, а при увеличении информации должен растягиваться. попробуйте.
|
|
трёхголовый белк семейства рептилоидов: "три головы - хорошо, на как же трудно придти к согласию..."
|
|
|
 |
|
|
Стаж: 8 лет 29 дней Сообщения: 741
Стиль: prosilver
Репутация: 15
перейти на сайт пользователя
Найти темы пользователя
|
Блин, сам не допер до br.  Сегодня вечером все сделаю  Надо еще немного фон подогнать и обрамление кнопок сделать белым цветом. Как получится, отпишусь. Реально очень качественная и нужная доработка. Форум более приятным становится  Спасибо, Андрей Добавлено спустя 5 часов 32 минуты 36 секунд:Убрал br, не помогло Добавлено спустя 4 минуты 27 секунд:Как то это связанно с h3 блока <div id="tab1" class="tab_content"> 
|
|
|
|
|
 |
|
|
Администратор |
 |
Стаж: 9 лет 4 месяца 20 дней Сообщения: 1235 Откуда: здешние мы
Стиль: subsilver2
Репутация: 11
перейти на сайт пользователя
Найти темы пользователя
|
попробуйте убрать внутренний отступ: в строке заменить padding:10px; на padding:0;либо можно попытаться отрегулировать всё внутри отступами. тогда заменить padding:10px; на padding:-10px 10px 0 10px;, где (по порядку) -10px - отступ сверху внутри блока 10px - отступ справа 0 - отступ снизу 10px - отступ слева...
|
|
трёхголовый белк семейства рептилоидов: "три головы - хорошо, на как же трудно придти к согласию..."
|
|
|
 |
|
|
Стаж: 8 лет 29 дней Сообщения: 741
Стиль: prosilver
Репутация: 15
перейти на сайт пользователя
Найти темы пользователя
|
К сожалению отступ сохраняется, padding:-10px не работает Показывает варнинг при просмотре кода  Выставил так: padding:0px 10px 0 10px; Отступ уменьшился, но все равно остался Добавлено спустя 9 минут 50 секунд:И еще один очень важный вопрос. Сейчас внимательно посмотрев внедренные кнопочки на форуме. Они оказались у меня все разными В посте стиль такой: Код: Выделить всё <style> #dop_fix {float:right;margin:10px;} ul.dop,ul.dop li{list-style:none;margin:0;padding:0;} ul.dop li{float:left;display:block;height:26px;} ul.dop li a {color:#ffffff;font-weight:normal;text-decoration:none;} .buttonn{margin:1px;padding:2px 4px 2px 4px;text-decoration:none;font-family:"Lucida Grande", Verdana, Helvetica, Arial, sans-serif;font-weight:normal;font-size:12px;display:inline-block;text-align:center;border:1px solid #9c9c9c;_border:1px solid rgba(0, 0, 0, 0.3);border:1px solid #ffffff;text-shadow:0 1px 0 rgba(0,0,0,0.4);box-shadow:0 0 .05em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .05em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .05em rgba(0,0,0,0.4);} .buttonn:hover{box-shadow:0 0 .1em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .1em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .1em rgba(0,0,0,0.4);} .buttonn:active{top:1px;} .button-blue{background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1));background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .button-blue:hover{background:#81a8cb;background:-webkit-gradient(linear, left top, left bottom, from(#4477a1), to(#81a8cb));background:-moz-linear-gradient(-90deg, #4477a1, #81a8cb);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4477a1', endColorstr='#81a8cb');} .button-blue:active{background:#4477a1;} .button-green{background:#428739;background:-webkit-gradient(linear, left top, left bottom, from(#c8dd95), to(#428739));background:-moz-linear-gradient(-90deg, #c8dd95, #428739);filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#c8dd95', EndColorStr='#428739');} .button-green:hover{background:#c8dd95;background:-webkit-gradient(linear, left top, left bottom, from(#428739), to(#c8dd95));background:-moz-linear-gradient(-90deg, #428739, #c8dd95);filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#428739', EndColorStr='#c8dd95');} .button-green:active{background:#428739;} .button-red{background:#D82741;background:-webkit-gradient(linear, left top, left bottom, from(#E84B6E), to(#D82741));background:-moz-linear-gradient(-90deg, #E84B6E, #D82741);filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#E84B6E', EndColorStr='#D82741');} .button-red:hover{background:#E84B6E;background:-webkit-gradient(linear, left top, left bottom, from(#D82741), to(#E84B6E));background:-moz-linear-gradient(-90deg, #D82741, #E84B6E);filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#D82741', EndColorStr='#E84B6E');} .button-red:active{background:#D82741;} </style> в index_body.html такой Код: Выделить всё <style> .tab_content{min-height:100px;padding:0px 10px 0 10px;margin-right:-4px;;background-color:#dae5ef;border:5px solid #4477a1;border-radius: 0px 0px 5px 5px;} .tabs{width:100%;list-style:none;margin:0;padding:0 2px;height:26px;background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1) );background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .buttond{float:left;margin:2px;padding:2px 4px 2px 4px;text-decoration:none;font-family:"Lucida Grande", Verdana, Helvetica, Arial, sans-serif;font-weight:normal;font-size:14px;display:inline-block;text-align:center;_border:1px solid #ffffff;text-shadow:0 1px 0 rgba(0,0,0,0.4);box-shadow:0 0 .05em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .05em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .05em rgba(0,0,0,0.4);} .buttond:hover{box-shadow:0 0 .1em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .1em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .1em rgba(0,0,0,0.4);} .buttond:active{position:relative;top:1px;} a.buttond{color:#FFFFFF;} .buttond-blue{background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1));background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .buttond-blue:hover{background:#81a8cb;background:-webkit-gradient(linear, left top, left bottom, from(#4477a1), to(#81a8cb));background:-moz-linear-gradient(-90deg, #4477a1, #81a8cb);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4477a1', endColorstr='#81a8cb');} .buttond-blue:active{background:#4477a1;} </style> Кнопки в верхнем меню другие. Стиль еще пока не нашел Можно же их сделать все одинаковыми, да? Просто я попробовал, получилось как то криво Добавлено спустя 16 секунд:Постараюсь более подробно расписать Добавлено спустя 10 минут 49 секунд:Хотелось бы чтобы этот стиль заработал, в нижнем меню: Код: Выделить всё .buttonn{margin:1px;padding:2px 4px 2px 4px;text-decoration:none;font-family:"Lucida Grande", Verdana, Helvetica, Arial, sans-serif;font-weight:normal;font-size:12px;display:inline-block;text-align:center;border:1px solid #9c9c9c;_border:1px solid rgba(0, 0, 0, 0.3);border:1px solid #ffffff;text-shadow:0 1px 0 rgba(0,0,0,0.4);box-shadow:0 0 .05em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .05em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .05em rgba(0,0,0,0.4);} .buttonn:hover{box-shadow:0 0 .1em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .1em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .1em rgba(0,0,0,0.4);} .buttonn:active{top:1px;} .button-blue{background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1));background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .button-blue:hover{background:#81a8cb;background:-webkit-gradient(linear, left top, left bottom, from(#4477a1), to(#81a8cb));background:-moz-linear-gradient(-90deg, #4477a1, #81a8cb);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4477a1', endColorstr='#81a8cb');} .button-blue:active{background:#4477a1;} Кнопки обвелись, но интерактивными не стали ((( Добавлено спустя 2 минуты 16 секунд:Вот так сделал: Код: Выделить всё <style> .tab_content{min-height:100px;padding:0px 10px 0 10px;margin-right:-4px;;background-color:#dae5ef;border:5px solid #4477a1;border-radius: 0px 0px 5px 5px;} .tabs{width:100%;list-style:none;margin:0;padding:0 2px;height:26px;background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1) );background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .buttonn{margin:1px;padding:2px 4px 2px 4px;text-decoration:none;font-family:"Lucida Grande", Verdana, Helvetica, Arial, sans-serif;font-weight:normal;font-size:12px;display:inline-block;text-align:center;border:1px solid #9c9c9c;_border:1px solid rgba(0, 0, 0, 0.3);border:1px solid #ffffff;text-shadow:0 1px 0 rgba(0,0,0,0.4);box-shadow:0 0 .05em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .05em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .05em rgba(0,0,0,0.4);} .buttonn:hover{box-shadow:0 0 .1em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .1em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .1em rgba(0,0,0,0.4);} .buttonn:active{top:1px;} .button-blue{background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1));background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .button-blue:hover{background:#81a8cb;background:-webkit-gradient(linear, left top, left bottom, from(#4477a1), to(#81a8cb));background:-moz-linear-gradient(-90deg, #4477a1, #81a8cb);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4477a1', endColorstr='#81a8cb');} .button-blue:active{background:#4477a1;} </style> <ul class="tabs"> <span><a class="buttonn button-blue" href="#tab1">{L_WHO_IS_ONLINE}</a></span> <span><a class="buttonn button-blue" href="#tab2">{L_TOP_THANKS_LIST}</a></span> <span><a class="buttonn button-blue" href="#tab3">{L_STATISTICS}</a></span> </ul> Получил так:  Опять туплю  Причем кнопки стали в виде ссылок с подчеркиванием 
|
|
|
|
|
 |
|
|
Администратор |
 |
Стаж: 9 лет 4 месяца 20 дней Сообщения: 1235 Откуда: здешние мы
Стиль: subsilver2
Репутация: 11
перейти на сайт пользователя
Найти темы пользователя
|
можете так попробовать: (заменить стиль внизу): Код: Выделить всё <style> .tab_content{min-height:100px;padding:0px 10px 0 10px;margin-right:-4px;;background-color:#dae5ef;border:5px solid #4477a1;border-radius: 0px 0px 5px 5px;} .tabs{width:100%;list-style:none;margin:0;padding:0 2px;height:26px;background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1) );background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .buttond{float:left;margin:2px;padding:2px 4px 2px 4px;display:inline-block;text-align:center;border:1px solid #ffffff;text-shadow:0 1px 0 rgba(0,0,0,0.4);box-shadow:0 0 .05em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .05em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .05em rgba(0,0,0,0.4);} .buttond:hover{box-shadow:0 0 .1em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .1em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .1em rgba(0,0,0,0.4);} .buttond:active{position:relative;top:1px;} a.buttond{color:#FFFFFF;text-decoration:none;font-family:"Lucida Grande", Verdana, Helvetica, Arial, sans-serif;font-weight:normal;font-size:12px;} .buttond-blue{background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1));background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .buttond-blue:hover{background:#81a8cb;background:-webkit-gradient(linear, left top, left bottom, from(#4477a1), to(#81a8cb));background:-moz-linear-gradient(-90deg, #4477a1, #81a8cb);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4477a1', endColorstr='#81a8cb');} .buttond-blue:active{background:#4477a1;} </style> насчёт отступа. сейчас посмотрел код просилвера - это ваш стандартный вариант с таким отступом. вот ваш стилевой файл h3: Код: Выделить всё h3 { /* Sub-headers (also used as post headers, but defined later) */ font-family: Arial, Helvetica, sans-serif; font-weight: bold; text-transform: uppercase; border-bottom: 1px solid #CCCCCC; margin-bottom: 3px; padding-bottom: 2px; font-size: 1.05em; color: #989898; margin-top: 20px; } видите? по умолчанию сдвиг сверху 20px править код в стиле - не выход, так как "поломается" всё на самом сайте. можно попробовать отредактировать локально: в каждом коде вывода, где у вас идёт открытие <h3>, можно попробовать заменить его на то есть "нивелировать" отступ только здесь. может поможет. попробуйте. Добавлено спустя 2 минуты 24 секунды:сейчас обратил внимание на косячок - сразу не заметил. в верхнем стилевом файле меню прописаны рабочими два "бордера". замените код на этот: Код: Выделить всё <style> #dop_fix {float:right;margin:10px;} ul.dop,ul.dop li{list-style:none;margin:0;padding:0;} ul.dop li{float:left;display:block;height:26px;} ul.dop li a {color:#ffffff;font-weight:normal;text-decoration:none;} .buttonn{margin:1px;padding:2px 4px 2px 4px;text-decoration:none;font-family:"Lucida Grande", Verdana, Helvetica, Arial, sans-serif;font-weight:normal;font-size:12px;display:inline-block;text-align:center;border:1px solid #ffffff;text-shadow:0 1px 0 rgba(0,0,0,0.4);box-shadow:0 0 .05em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .05em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .05em rgba(0,0,0,0.4);} .buttonn:hover{box-shadow:0 0 .1em rgba(0,0,0,0.4);-moz-box-shadow:0 0 .1em rgba(0,0,0,0.4);-webkit-box-shadow:0 0 .1em rgba(0,0,0,0.4);} .buttonn:active{top:1px;} .button-blue{background:#4477a1;background:-webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1));background:-moz-linear-gradient(-90deg, #81a8cb, #4477a1);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1');} .button-blue:hover{background:#81a8cb;background:-webkit-gradient(linear, left top, left bottom, from(#4477a1), to(#81a8cb));background:-moz-linear-gradient(-90deg, #4477a1, #81a8cb);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4477a1', endColorstr='#81a8cb');} .button-blue:active{background:#4477a1;} .button-green{background:#428739;background:-webkit-gradient(linear, left top, left bottom, from(#c8dd95), to(#428739));background:-moz-linear-gradient(-90deg, #c8dd95, #428739);filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#c8dd95', EndColorStr='#428739');} .button-green:hover{background:#c8dd95;background:-webkit-gradient(linear, left top, left bottom, from(#428739), to(#c8dd95));background:-moz-linear-gradient(-90deg, #428739, #c8dd95);filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#428739', EndColorStr='#c8dd95');} .button-green:active{background:#428739;} .button-red{background:#D82741;background:-webkit-gradient(linear, left top, left bottom, from(#E84B6E), to(#D82741));background:-moz-linear-gradient(-90deg, #E84B6E, #D82741);filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#E84B6E', EndColorStr='#D82741');} .button-red:hover{background:#E84B6E;background:-webkit-gradient(linear, left top, left bottom, from(#D82741), to(#E84B6E));background:-moz-linear-gradient(-90deg, #D82741, #E84B6E);filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#D82741', EndColorStr='#E84B6E');} .button-red:active{background:#D82741;} </style>
|
|
трёхголовый белк семейства рептилоидов: "три головы - хорошо, на как же трудно придти к согласию..."
|
|
|
 |
|
|
Администратор |
 |
Стаж: 9 лет 4 месяца 20 дней Сообщения: 1235 Откуда: здешние мы
Стиль: subsilver2
Репутация: 11
перейти на сайт пользователя
Найти темы пользователя
|
по первому коду (перебор внизу): судя по коду на вашей странице - вы неправильно прописали ссылки. наверное скопировали когда "экспериментировали"... смотрите: Код: Выделить всё <ul class="tabs"> <span><a class="buttonn button-blue" href="#tab1">Кто сейчас на конференции</a></span> <span><a class="buttonn button-blue" href="#tab2">Топлист благодарностей</a></span> <span><a class="buttonn button-blue" href="#tab3">Статистика</a></span> </ul>
а должно быть неправильно класс прописан. исправьте - всё должно работать. стилевой код меню находится в файле menu.css (вроде этот у вас) в папке theme.
|
|
трёхголовый белк семейства рептилоидов: "три головы - хорошо, на как же трудно придти к согласию..."
|
|
|
 |
|
|
Стаж: 8 лет 29 дней Сообщения: 741
Стиль: prosilver
Репутация: 15
перейти на сайт пользователя
Найти темы пользователя
|
Стоп. Кажись понял по нижней части Добавлено спустя 4 минуты 11 секунд:Точно, до самого доперло  Работает Только кнопочки как бы не по центру этой синей полоски... Но тут вроде очевидно buttond{float:left;margin:2px;padding:2px 4px 2px 4px; paddingом поиграюсь Добавлено спустя 3 минуты 20 секунд:А на счет меню, у меня этот файл называется my.css Код: Выделить всё #menu, #menu ul { margin: 0; padding: 0; list-style: none; } #menu { width: 100%; margin-top: 4px; padding: 1px 0; background: #4477a1; background: -webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1) ); background: -moz-linear-gradient(-90deg, #81a8cb, #4477a1); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1'); } #menu:before, #menu:after { content: ""; display: table; } #menu:after { clear: both; } #menu { zoom:1; } #menu li { float: left; border-right: 1px solid #dcdcdc; border-left: 1px solid #dcdcdc; position: relative; background: #4477a1; background: -webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1) ); background: -moz-linear-gradient(-90deg, #81a8cb, #4477a1); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1'); } #menu li:hover { background: #81a8cb; background: -webkit-gradient(linear, left top, left bottom, from(#4477a1), to(#81a8cb) ); background: -moz-linear-gradient(-90deg, #4477a1, #81a8cb); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4477a1', endColorstr='#81a8cb'); } #menu li :active{ background: #4477a1; } #menu a { float: left; padding: 2px 5px; color: #fff; font: normal 12px Arial, Helvetica; text-decoration: none; } #menu li:hover > a { color: #dcdcdc; } *html #menu li a:hover { /* Только для IE6 */ color: #dcdcdc; } #menu ul { margin: 20px 0 0 0; _margin: 0; /*Только для IE6*/ opacity: 0; visibility: hidden; position: absolute; top: 28px; left: 0; z-index: 9999; background: #12A3EB; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .poloska, .poloska ul { margin: 0; padding: 0; list-style: none; } .poloska { width: 100%; margin-top: 4px; padding: 1px 0; } .poloska:before, .poloska:after { content: ""; display: table; } .poloska:after { clear: both; } .poloska { zoom:1; } .poloska li { float: left; border-right: 1px solid #dcdcdc; border-left: 1px solid #dcdcdc; position: relative; background: #4477a1; background: -webkit-gradient(linear, left top, left bottom, from(#81a8cb), to(#4477a1) ); background: -moz-linear-gradient(-90deg, #81a8cb, #4477a1); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#81a8cb', endColorstr='#4477a1'); } .poloska li:hover { background: #81a8cb; background: -webkit-gradient(linear, left top, left bottom, from(#4477a1), to(#81a8cb) ); background: -moz-linear-gradient(-90deg, #4477a1, #81a8cb); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4477a1', endColorstr='#81a8cb'); } .poloska li :active{ background: #4477a1; } .poloska a { float: left; padding: 2px 5px; color: #fff; font: normal 12px Arial, Helvetica; text-decoration: none; } .poloska li:hover > a { color: #dcdcdc; } *html .poloska li a:hover { /* Только для IE6 */ color: #dcdcdc; } .poloska ul { margin: 20px 0 0 0; _margin: 0; /*Только для IE6*/ opacity: 0; visibility: hidden; position: absolute; top: 28px; left: 0; z-index: 9999; background: #12A3EB; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } это именно тот файл, т.к. он прописан тут styles/prosilver/theme/stylesheet.css Но в нем нет этого стиля. Вообще не понятно как у меня все работает 
|
|
|
|
|
 |
|
|
Администратор |
 |
Стаж: 9 лет 4 месяца 20 дней Сообщения: 1235 Откуда: здешние мы
Стиль: subsilver2
Репутация: 11
перейти на сайт пользователя
Найти темы пользователя
|
это отступы ВНУТРИ самой кнопки. скорее надо здесь паддингом поиграться... Код: Выделить всё .tabs{width:100%;list-style:none;margin:0;padding:0 2px; Добавлено спустя 12 минут 46 секунд:
 Но в нем нет этого стиля. Вообще не понятно как у меня все работает
судя по коду - это код вывода кнопочек в теме (viewtopic_body), а вот меню у вас в этом коде есть. ведь его код вот этот: Код: Выделить всё <ul id="menu"> <li class="rightside"><a href="./index.php?mobile_style=on" title="Мобильный вид" accesskey="p" class="print" style="background-image: url(./styles/prosilver/theme/images/icon_mobile.gif)">Мобильный вид</a></li> <li><a href="./faq_main.html">FAQ</a></li> <li><a href="./gallery/index.php" title="Галерея изображений">Галереи</a></li> <li><a href="./search.php">Поиск</a></li> <li><a href="./rules/" title="Правила Форума">Правила</a></li> <li style="float:right;"><a href="./ucp.php?mode=login">Вход</a></li> <li style="float:right;"><a href="./ucp.php?mode=register">Регистрация</a></li> </ul>
|
|
трёхголовый белк семейства рептилоидов: "три головы - хорошо, на как же трудно придти к согласию..."
|
|
|
 |
|
|
Стаж: 8 лет 29 дней Сообщения: 741
Стиль: prosilver
Репутация: 15
перейти на сайт пользователя
Найти темы пользователя
|
 а такой в природе вообще существует?
Это с тобой на 100% согласен!  Но люди все равно смотрят и потом нервно кусают пальцы в ожидании дождей на море  Хотя, по моему опыту, дождь идет в горах и редко доходит до моря. Яндекс врет на 90% Тем не менее Информер очень хорошо вписался с структуру форума Делается все просто. Открываем информер от Яндекса: https://yandex.ru/pogoda/11463/informerВписываем в одну из ссылок название: Код: Выделить всё <span><a class="buttond buttond-blue" href="#tab4">Погода в Крыму</a></span> Ну и выводим блоки разделяя их пробелами, например: + еще выровнил по центру, прописав style="text-align: center;" Код: Выделить всё <div id="tab4" class="tab_content" style="text-align: center;"> <br> <a href="https://clck.yandex.ru/redir/dtype=stred/pid=7/cid=1228/*https://yandex.ru/pogoda/11472" target="_blank"><img src="https://info.weather.yandex.net/11472/1_white.ru.png?domain=ru" border="0" alt="Яндекс.Погода"/><img width="1" height="1" src="https://clck.yandex.ru/click/dtype=stred/pid=7/cid=1227/*https://img.yandex.ru/i/pix.gif" alt="" border="0"/></a> <a href="https://clck.yandex.ru/redir/dtype=stred/pid=7/cid=1228/*https://yandex.ru/pogoda/11470" target="_blank"><img src="https://info.weather.yandex.net/11470/1_white.ru.png?domain=ru" border="0" alt="Яндекс.Погода"/><img width="1" height="1" src="https://clck.yandex.ru/click/dtype=stred/pid=7/cid=1227/*https://img.yandex.ru/i/pix.gif" alt="" border="0"/></a> <a href="https://clck.yandex.ru/redir/dtype=stred/pid=7/cid=1228/*https://yandex.ru/pogoda/11471" target="_blank"><img src="https://info.weather.yandex.net/11471/1_white.ru.png?domain=ru" border="0" alt="Яндекс.Погода"/><img width="1" height="1" src="https://clck.yandex.ru/click/dtype=stred/pid=7/cid=1227/*https://img.yandex.ru/i/pix.gif" alt="" border="0"/></a> <a href="https://clck.yandex.ru/redir/dtype=stred/pid=7/cid=1228/*https://yandex.ru/pogoda/959" target="_blank"><img src="https://info.weather.yandex.net/959/1_white.ru.png?domain=ru" border="0" alt="Яндекс.Погода"/><img width="1" height="1" src="https://clck.yandex.ru/click/dtype=stred/pid=7/cid=1227/*https://img.yandex.ru/i/pix.gif" alt="" border="0"/></a> <a href="https://clck.yandex.ru/redir/dtype=stred/pid=7/cid=1228/*https://yandex.ru/pogoda/11463" target="_blank"><img src="https://info.weather.yandex.net/11463/1_white.ru.png?domain=ru" border="0" alt="Яндекс.Погода"/><img width="1" height="1" src="https://clck.yandex.ru/click/dtype=stred/pid=7/cid=1227/*https://img.yandex.ru/i/pix.gif" alt="" border="0"/></a> </div> Добавлено спустя 8 минут 30 секунд:Вывел погоду на главную по умолчанию. Не все находят её Получилось красиво. 
|
|
|
|
|
 |
|