phpbb-belk.ru

темы, связанные с форумом phpbb 3.0.x

Новая тема

Страница 1 из 1

[ Сообщений: 27 ]

Просмотры: 1083

Скрипт открытия блоков

Версия для печати

Пред. тема | След. тема

Автор Сообщение

Belk (Андрей)

2019-07-08

#11
|

Администратор

Стаж: 8 лет 6 месяцев 28 дней
Сообщения: 1223
Откуда: здешние мы

Стиль: 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%">&nbsp;</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 -->&nbsp; &bull; &nbsp;<a href="{U_REGISTER}">{L_REGISTER}</a><!-- ENDIF --></h3>
      <fieldset class="quick-login">
         <label for="username">{L_USERNAME}:</label>&nbsp;<input type="text" name="username" id="username" size="10" class="inputbox" title="{L_USERNAME}" />
         <label for="password">{L_PASSWORD}:</label>&nbsp;<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} &bull; {TOTAL_TOPICS} <!-- IF TOTAL_IMAGES --> &bull; {TOTAL_IMAGES}<!-- ENDIF --> &bull; {TOTAL_USERS} &bull; {NEWEST_USER}</p>
<!-- ENDIF -->
</div>



<!-- INCLUDE overall_footer.html -->

как-то так...

трёхголовый белк семейства рептилоидов:
"три головы - хорошо, на как же трудно придти к согласию..."

javascript

Цитата

Dmitry (Дмитрий)

2019-07-08

#12
|

Стаж: 7 лет 3 месяца 6 дней
Сообщения: 734

Стиль: prosilver

Репутация: 15

перейти на сайт пользователя
Найти темы пользователя

Профиль

Вот жеж.

Это надо понимать, где скрипт подключать надо. :bm:

Пошел пробовать

Спасибо!

Добавлено спустя 13 минут 36 секунд:
Почти получилось! :idea:

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

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

Хотя они у меня действительно прописаны и меню из них верхнее, и кнопки в постах

Еще пробел бы убрать, он явно лишний.

А скруглить этот блок можно же тут, да?

Код: Выделить всё

<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;}
Верно? :)

Цитата

Belk (Андрей)

2019-07-08

#13
|

Администратор

Стаж: 8 лет 6 месяцев 28 дней
Сообщения: 1223
Откуда: здешние мы

Стиль: 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%">&nbsp;</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 -->&nbsp; &bull; &nbsp;<a href="{U_REGISTER}">{L_REGISTER}</a><!-- ENDIF --></h3>
      <fieldset class="quick-login">
         <label for="username">{L_USERNAME}:</label>&nbsp;<input type="text" name="username" id="username" size="10" class="inputbox" title="{L_USERNAME}" />
         <label for="password">{L_PASSWORD}:</label>&nbsp;<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} &bull; {TOTAL_TOPICS} <!-- IF TOTAL_IMAGES --> &bull; {TOTAL_IMAGES}<!-- ENDIF --> &bull; {TOTAL_USERS} &bull; {NEWEST_USER}</p>
<!-- ENDIF -->
</div>

<!-- INCLUDE overall_footer.html -->

ушёл по делам.

трёхголовый белк семейства рептилоидов:
"три головы - хорошо, на как же трудно придти к согласию..."

Цитата

Dmitry (Дмитрий)

2019-07-08

#14
|

Стаж: 7 лет 3 месяца 6 дней
Сообщения: 734

Стиль: prosilver

Репутация: 15

перейти на сайт пользователя
Найти темы пользователя

Профиль

Ага, по второму варианту получилось. :idea:

Спасибо, Андрей! :arigato:

Только вот пробел убрать не могу

тэги <p> по убирал - не помогло

Пробел явно лишний :cry:

Скругление добавил.
А что если эти кнопки прямо в блок засунуть, а? Тогда бы и накладок не было, и выглядело красиво

Добавлено спустя 16 минут 35 секунд:
Скруглил только нижние края + удалил дни рождения. Они выводятся сверху, когда они есть. Получилось очень даже красиво.
Осталось только пробел/отступ грохнуть.
Андрей, подскажи плз, если знаешь :oops:

Добавлено спустя 12 минут 56 секунд:
Хотел также спросить это фиксированный размер блока? А если будет больше пользователей во вкладке КТО СЕЙЧАС НА КОНФЕРЕНЦИИ. Он будет автоматом растягиваться? Такое впечатление, что все вкладки одинаковые по размеру блока и он определяется именно содержимым первой вкладки

P.S. Думаю еще перетащить кнопки из верхнего меню, в нижнее. Тут мне уже все понятно стало :idea:

Классная доработка. :idea:

Цитата

Belk (Андрей)

2019-07-08

#15
|

Администратор

Стаж: 8 лет 6 месяцев 28 дней
Сообщения: 1223
Откуда: здешние мы

Стиль: subsilver2

Репутация: 11

перейти на сайт пользователя
Найти темы пользователя

Профиль

Dmitry писал(а):

Осталось только пробел/отступ грохнуть.

из строки

Код: Выделить всё

<div id="tab1" class="tab_content">
<br />

уберите <br />

убрать с каждой.

размер блока по длине - резиновый, по ширине - фиксированный. правится здесь:

Код: Выделить всё

.tab_content{height:150px;padding:10px;margin-right:-4px;;background-color:#FFFFFF;border:1px solid #4477a1;}

Код: Выделить всё

height:150px - ширина.

можно попробовать написать min-height:150px;, тогда вроде долно быть фиксировано минимально 150, а при увеличении информации должен растягиваться. попробуйте.

трёхголовый белк семейства рептилоидов:
"три головы - хорошо, на как же трудно придти к согласию..."

Цитата

Dmitry (Дмитрий)

2019-07-09

#16
|

Стаж: 7 лет 3 месяца 6 дней
Сообщения: 734

Стиль: prosilver

Репутация: 15

перейти на сайт пользователя
Найти темы пользователя

Профиль

Блин, сам не допер до br. :dash3:

Сегодня вечером все сделаю :idea:

Надо еще немного фон подогнать и обрамление кнопок сделать белым цветом.
Как получится, отпишусь.
Реально очень качественная и нужная доработка. :idea:

Форум более приятным становится

Спасибо, Андрей :arigato:

Добавлено спустя 5 часов 32 минуты 36 секунд:
Убрал br, не помогло :cry:

Добавлено спустя 4 минуты 27 секунд:
Как то это связанно с h3 блока <div id="tab1" class="tab_content">

Цитата

Belk (Андрей)

2019-07-09

#17
|

Администратор

Стаж: 8 лет 6 месяцев 28 дней
Сообщения: 1223
Откуда: здешние мы

Стиль: subsilver2

Репутация: 11

перейти на сайт пользователя
Найти темы пользователя

Профиль

попробуйте убрать внутренний отступ:

в строке

Код: Выделить всё

.tab_content{height:150px;padding:10px;

заменить padding:10px; на padding:0;

либо можно попытаться отрегулировать всё внутри отступами. тогда заменить

padding:10px; на padding:-10px 10px 0 10px;, где (по порядку)

-10px - отступ сверху внутри блока
10px - отступ справа
0 - отступ снизу
10px - отступ слева...

трёхголовый белк семейства рептилоидов:
"три головы - хорошо, на как же трудно придти к согласию..."

Цитата

Dmitry (Дмитрий)

2019-07-09

#18
|

Стаж: 7 лет 3 месяца 6 дней
Сообщения: 734

Стиль: prosilver

Репутация: 15

перейти на сайт пользователя
Найти темы пользователя

Профиль

К сожалению отступ сохраняется, padding:-10px не работает :cry:

Показывает варнинг при просмотре кода

Выставил так: 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>

Кнопки в верхнем меню другие. Стиль еще пока не нашел :bm:

Можно же их сделать все одинаковыми, да?
Просто я попробовал, получилось как то криво

Добавлено спустя 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>

Получил так:

Опять туплю :dash3:

Причем кнопки стали в виде ссылок с подчеркиванием

Цитата

Belk (Андрей)

2019-07-09

#19
|

Администратор

Стаж: 8 лет 6 месяцев 28 дней
Сообщения: 1223
Откуда: здешние мы

Стиль: 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>, можно попробовать заменить его на

Код: Выделить всё

<h3 style="margin-top: -20px;">

то есть "нивелировать" отступ только здесь. может поможет. попробуйте.

Добавлено спустя 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>

трёхголовый белк семейства рептилоидов:
"три головы - хорошо, на как же трудно придти к согласию..."

Цитата

Dmitry (Дмитрий)

2019-07-09

#20
|

Стаж: 7 лет 3 месяца 6 дней
Сообщения: 734

Стиль: prosilver

Репутация: 15

перейти на сайт пользователя
Найти темы пользователя

Профиль

Belk писал(а):

можете так попробовать: (заменить стиль внизу):

Внизу заменил на предложенный вариант, кнопки вовсе исчезли, остались лишь ссылки

Belk писал(а):

сейчас обратил внимание на косячок - сразу не заметил. в верхнем стилевом файле меню прописаны рабочими два "бордера". замените код на этот:

Не пойму где искать этот стиль. У меня в overall_header.html его нет

styles/prosilver/theme/my.css
тут тоже нет. Блин какой же я тупой :oops:

Нифига не получается :cry:

Добавлено спустя 13 минут 49 секунд:

Belk писал(а):

то есть "нивелировать" отступ только здесь. может поможет. попробуйте.

Да, способ рабочий!

Цитата

Belk (Андрей)

2019-07-09

#21
|

Администратор

Стаж: 8 лет 6 месяцев 28 дней
Сообщения: 1223
Откуда: здешние мы

Стиль: subsilver2

Репутация: 11

перейти на сайт пользователя
Найти темы пользователя

Профиль

по первому коду (перебор внизу):

судя по коду на вашей странице - вы неправильно прописали ссылки. наверное скопировали когда "экспериментировали"... :-D

смотрите:

Код: Выделить всё

<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>

а должно быть

Код: Выделить всё

<span><a class="buttond buttond-blue"

неправильно класс прописан. исправьте - всё должно работать.

стилевой код меню находится в файле menu.css (вроде этот у вас) в папке theme.

трёхголовый белк семейства рептилоидов:
"три головы - хорошо, на как же трудно придти к согласию..."

Цитата

Dmitry (Дмитрий)

2019-07-09

#22
|

Стаж: 7 лет 3 месяца 6 дней
Сообщения: 734

Стиль: prosilver

Репутация: 15

перейти на сайт пользователя
Найти темы пользователя

Профиль

Стоп. Кажись понял по нижней части

Добавлено спустя 4 минуты 11 секунд:
Точно, до самого доперло :-D

Работает

Только кнопочки как бы не по центру этой синей полоски...
Но тут вроде очевидно buttond{float:left;margin:2px;padding:2px 4px 2px 4px;
paddingом поиграюсь :-D

Добавлено спустя 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

Но в нем нет этого стиля. Вообще не понятно как у меня все работает :dash3:

Цитата

Belk (Андрей)

2019-07-09

#23
|

Администратор

Стаж: 8 лет 6 месяцев 28 дней
Сообщения: 1223
Откуда: здешние мы

Стиль: subsilver2

Репутация: 11

перейти на сайт пользователя
Найти темы пользователя

Профиль

Код: Выделить всё

padding:2px 4px 2px 4px;

это отступы ВНУТРИ самой кнопки.

скорее надо здесь паддингом поиграться...

Код: Выделить всё

.tabs{width:100%;list-style:none;margin:0;padding:0 2px;

Добавлено спустя 12 минут 46 секунд:

Dmitry писал(а):

Но в нем нет этого стиля. Вообще не понятно как у меня все работает

судя по коду - это код вывода кнопочек в теме (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>

трёхголовый белк семейства рептилоидов:
"три головы - хорошо, на как же трудно придти к согласию..."

Цитата

Dmitry (Дмитрий)

2019-07-10

#24
|

Стаж: 7 лет 3 месяца 6 дней
Сообщения: 734

Стиль: prosilver

Репутация: 15

перейти на сайт пользователя
Найти темы пользователя

Профиль

Да, все верно, Андрей! Заменил и верхнее меню. :arigato:

Спасибо, все работает!!! Ура! :idea:

Добавлено спустя 17 минут 40 секунд:
А просильвер то преображается, Андрей! Уже довольно приятно смотреть становится :-D

Добавлено спустя 21 час 14 минут 26 секунд:
Теперь хочу поставить актуальный информер прогноза погоды в одну из вкладок. Как получится отпишусь тут

Цитата

Belk (Андрей)

2019-07-10

#25
|

Администратор

Стаж: 8 лет 6 месяцев 28 дней
Сообщения: 1223
Откуда: здешние мы

Стиль: subsilver2

Репутация: 11

перейти на сайт пользователя
Найти темы пользователя

Профиль

Dmitry писал(а):

актуальный информер прогноза погоды

а такой в природе вообще существует? :-D

трёхголовый белк семейства рептилоидов:
"три головы - хорошо, на как же трудно придти к согласию..."

Цитата

Dmitry (Дмитрий)

2019-07-10

#26
|

Стаж: 7 лет 3 месяца 6 дней
Сообщения: 734

Стиль: prosilver

Репутация: 15

перейти на сайт пользователя
Найти темы пользователя

Профиль

Belk писал(а):

а такой в природе вообще существует?

Это с тобой на 100% согласен! :-D

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

Хотя, по моему опыту, дождь идет в горах и редко доходит до моря. Яндекс врет на 90% :-D

Тем не менее Информер очень хорошо вписался с структуру форума

Делается все просто.

Открываем информер от Яндекса:
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>
&nbsp;
<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>
&nbsp;
<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>
&nbsp;
<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>
&nbsp;
<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 секунд:
Вывел погоду на главную по умолчанию. Не все находят её :-D

Получилось красиво.

Цитата

Belk (Андрей)

2019-07-10

#27
|

Администратор

Стаж: 8 лет 6 месяцев 28 дней
Сообщения: 1223
Откуда: здешние мы

Стиль: subsilver2

Репутация: 11

перейти на сайт пользователя
Найти темы пользователя

Профиль

да, нормальненько получилось - сейчас глянул.

трёхголовый белк семейства рептилоидов:
"три головы - хорошо, на как же трудно придти к согласию..."

Цитата

Страница 1 из 1

[ Сообщений: 27 ]

Кто сейчас на сайте:

Всего посетителей: 0, из них зарегистрированных: 0, скрытых: 0 и гостей: 0 (основано на активности пользователей за последние 5 минут)
Больше всего посетителей (122) здесь было 19 дек 2023, 12:10

Сейчас этот раздел просматривают: нет зарегистрированных пользователей и гости: 0

Разделы » Сайтостроение » Разное

Часовой пояс: UTC + 2 часа

Вы не можете начинать темы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете добавлять вложения
Вы можете защищать свои темы паролем

Перейти: