•●Anime Crossroads●• - проект помощи и поддержки аниме ролевых

Объявление

Доброго времени суток! Рады приветствовать вас на проекте •●Anime Crossroads●•. Это уникальный проект помощи и поддержки ролевых игр, по мотивам аниме и манги. На проекте собрано всё, что необходимо для создания и успешного функционирования вашей ролевой. От мастерской по созданию стилей, до каталога ролевых ресурсов и практических советов по продвижению форума. От гостей скрыто большинство информации, поэтому не сидите просто так, а регистрируйтесь.
Уважаемые гости, рады сообщить, что после долгой передышки форум вновь начинает работать.
Объявляться повторный набор:Модераторов, Журналистов, Пиарщиков, Мастеров, Техников, Архивистов, Учителей, Критиков.


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

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



Скрипты от участников

Сообщений 1 страница 16 из 16

1

У вас завалялось несколько скриптов? Тогда быстро кидайте их сюда!

0

2

Сузить форум (Автоматически по середине)
Выделенное цветом меняем на своё значение (100% - стандартный размер форума)

<style>
#pun {width: 70%; margin: 0 auto;}
</style>


___
Сделать текст названий категорий по центру

<style>
#pun-index #pun-main h2 {text-align: center;}
</style>


___
Изменить шрифт и размер текста в названии категорий.
Выделенное цветом меняем на своё. (16px - размер текста согласно "Ворду"; Palatino Linotype - название шрифта, согласно "Ворду")

<style>
#pun-main h2, #pun-stats h2, #pun-main h1{
font-size: 16px;
font-family: Palatino Linotype;
}
</style>

+1

3

Оригинал поста ТУТ (с)

Популярное сейчас на многих форумах меню. Суть проста: в объявлении или ещё где-то стоит несколько блоков, при нажатии на которые открывается меню.
Такое стоит и у нас (Администрация, Навигация, Конкурсы, Партнёры)

о1. Установка.
В HTML-верх ставите код:

Код:
<style> 
div .splLink {width: 130px; height: 40px; border: 2px solid #FFD700; background: #FFFFCC; text-align: center; font-family: Comic Sans Ms; font-size: 15px; padding: 5px;}
.spll {width: 130px; height: 70px; }
.spll div .splCont {height: auto; width: 300px; background:  url(https://forumupload.ru/uploads/0003/83/96/1556-1.png); padding: 5px; z-index: 1000; margin-top: 5px; border: 2px solid #FFD700; font-size: 12px; font-family: Microsoft Sans Serif; text-align: center;}
</style>

В HTML-низ ставите скрипт:

Код:
<!--Спойлер - контейнер-->
<script type="text/javascript" src="http://szenprogs.ru/scripts/jquery-1.3.2.js"></script>
<script type="text/javascript"> 
  $(document).ready(function(){
    $('.splLink').click(function(){
      $(this).parent().children('div.splCont').toggle('normal');
      return false;
    });
  });
</script>

А это ставите туда, где хотите увидеть само меню (как правило это объявление):

Код:
<center><table style="width: 90%">
<tr>

<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Первый контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>
<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Второй контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>
<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Третий контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>
<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Четвёртый контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>
<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Пятый контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>
<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Шестой контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>

</tr>
</table></center>

о2. Заполнение меню.
Чтобы заполнить меню своим содержимым, надо обратиться к третьей части кода.

а). По-умолчанию в коде содержится 6 блоков. По своему усмотрению Вы можете изменить это число, добавив новые или удалив какие-либо. Чтобы осуществить это, достаточно размножить (в случае увеличения числа блоков) или удалить (для уменьшения их числа) такой фрагмент:

Код:
<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Шестой контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>

Внимание! Не меняйте НИКАКИЕ числовые значения в этой части кода! В противном случае меню перестанет работать!

б). Чтобы заменить информацию в основных блоках, найдите в коде слова "Первый блок". Замените их на нужное Вам. Это может быть как текстовая информация, так и графическая (картинки). Можно использовать любой HTML.

в). Чтобы заменить информацию в выпадающих блоках, найдите в коде слова "Тут будет что-то" и замените на нужную Вам информацию. Это может быть как текстовая информация, так и графическая (картинки). Можно использовать любой HTML.

о3. Оформление меню.
Оформление выпадающего меню необходимо менять в первой части кода.
Ниже приведены доступные для пользователей изменения в дизайне:

а).

Код:
div .splLink {width: 130px; height: 40px; border: 2px solid #FFD700; background: #FFFFCC; text-align: center; font-family: Comic Sans Ms; font-size: 15px; padding: 5px;}

Отвечает за дизайн основных блоков.
width: 130px; - ширина основных блоков, в пикселах.
height: 40px; - высота основных блоков, в пикселах.
border: 2px solid #FFD700; - толщина, метод начертаний и цвет границ основных блоков.
background: #FFFFCC; - цвет фона основных блоков.
text-align: center; - выравнивание текста в основных блоках (по-умолчанию: центр).
font-family: Comic Sans Ms; - шрифт в основных блоках меню.
font-size: 15px; - размер текста в основных блоках меню.
padding: 5px; - отступ от краёв основных блокв (поля).

б).

Код:
.spll {width: 130px; height: 70px; }

Не рекомендовано для изменения неопытным пользователям!
Замечание: width: 130px; менять одновременно с предыдущим значением ширины (ширина основных блоков).
в).

Код:
.spll div .splCont {height: auto; width: 300px; background:  url(https://forumupload.ru/uploads/0003/83/96/1556-1.png); padding: 5px; z-index: 1000; margin-top: 5px; border: 2px solid #FFD700; font-size: 12px; font-family: Microsoft Sans Serif; text-align: center;}

Отвечает за дизайн выпадающих блоков.
height: auto; - высота выпадающих блоков. По-умолчанию осуществляется автоподгон по ширине. При необходимости можно заменить auto на любое числовое значение с указанием единиц измерения.
width: 300px; - ширина выпадающих блоков.
background:  url(https://forumupload.ru/uploads/0003/83/96/1556-1.png); - фоновое изображение выпадающих блоков. При необходимости можно установить непрозрачный цвет, путём замены на background: #FFFFCC; с указанием нужного цвета.
padding: 5px; - отступ от краёв выпадающих блокв (поля).
z-index: 1000; не рекомендовано к изменению. Данный параметр отвечает за наложение выпадающих блоков на форум. При уменьшении этого значения меню будет открывыться под таблицу форума. Если какой-либо элемент форума закрывает собой выпадающии меню, это значение необходимо увеличить.
margin-top: 5px; - отступ, между основными и выпадающими блоками. При значении 0 - без отступа.
border: 2px solid #FFD700; - толщина, метод начертаний и цвет границ выпадающих блоков.
font-size: 12px; - размер текста в выпадающих блоках меню.
font-family: Microsoft Sans Serif; - шрифт в выпадающих блоках меню.
text-align: center; - выравнивание текста в выпадающих блоках (по-умолчанию: центр).

Внимание! Производить какие-либо изменения во второй части кода ЗАПРЕЩЕНО!

+9

4

Спасибо за информацию! Но у меня есть один вопрос: А как сделать так, чтобы колонки снизу появлялись не тогда, когда на них нажимают, а когда на них просто наводят мышкой?

0

5

Прозрачность изображения. (осветление)

Код давно не новый, но и не такой уж и старый. Вариантов на него масса, но думаю, что стоит поделится более менее не проблемным и в "любом варианте"

1.Распространяется только на одну картинку. 

<img src="ссылка на картинку" style="opacity:0.3; -moz-opacity:0.3; filter:alpha(opacity=40);">

Прозрачность определяется opacity:0.3; (от 0.1 до 0.9)
Ставиться вместо обычного тега <img srs=""> Так как внутри уже имеется этот тег.

2. На определенную группу баннеров.
В html-верх

<style>
#banners a img {
opacity:0.3; -moz-opacity:0.3; filter:alpha(opacity=40);
}
#banners a:hover img {
opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);
}
</style>

Само собой туда, где будут баннеры

<div id="banners"> Группа баннеров </div>

Тоже самое. Прозрачность определяется a img {opacity:0.3; (от 0.1 до 0.9)

3. Прозрачность всех изображений (кликабельных) на форуме.

<style>
a img {
opacity:0.3; -moz-opacity:0.3; filter:alpha(opacity=40);
}
a:hover img {
opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);
}
</style>

Прозрачность определяется a img {opacity:0.3; (от 0.1 до 0.9)

0

6

Спасибо огромное. Но я ищу вот что - когда вот эта навигация (например как у вас),но только с картинкой. Я ничего не понимаю, как сделать так, чтобы была картинка в меню, на нее нажимаешь и появляется колонка твоя. Тоже самое, что и написала ~Yukiko, только с картинками?

0

7

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

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

Для начала вам в запрос скриптов Заказ на поиск скрипта хотя бы сюда. И я не совсем понял. Вы сейчас говорите о "Партнеры" "Конкурсы" то что выдвигается? Это итак картинками сделано

0

8

Скрипт делает строку пользователя (ник, статус, аватар, прочее) по середине колонки.
Вставляется в HTML верх.

Код:
<style type="text/css">
.pa-adnote{ text-align: center;}
.pa-from{ text-align: center;}
.pa-reg{ text-align: center;}
.pa-posts{ text-align: center;}
.pa-respect{ text-align: center;}
.pa-positive{ text-align: center;}
.pa-reputation{ text-align: center;}
.pa-sex{ text-align: center;}
.pa-icq{ text-align: center;}
.pa-ip{ text-align: center;}
.pa-online{ text-align: center;}
.pa-age{ text-align: center;}
.pa-mailagent{ text-align: center;}
.pa-reg { text-align: center;}
.pa-avatar, .pa-title, .pa-author { text-align: center;}
.pa-time-visit{ text-align: center;}
.pa-last-visit{ text-align: center;}
.pa-fld1{ text-align: center;}
.pa-fld2{ text-align: center;}
.pa-fld3{ text-align: center;}
.pa-fld4{ text-align: center;}
</style>

0

9

Скажите пожалуйста код на простой скрипт!

0

10

Кошечка
не сюда вопрос и на какой "простой"

0

11

На обычный скрипт, что ставится возле названия форума. Не прозрачный и без всяких дополнений.

0

12

Кошечка
На иконки что ли?
Вам рассказать что такое скрипт?

скрипт - это программа, которая автоматизирует некоторую задачу, которую без сценария пользователь делал бы вручную, используя интерфейс программы.

Вот это скрипт. Как я понял вы хотите поменять что то в элементах дизайна, тогда это будет уже скорее код css

А теперь скажите какой именно. Их очень много. И простых и не простых

0

13

у меня вопрос, возможно не по теме, но для меня он многое значит.
Какой шрифт был использован в постах номер 1 и 2?

0

14

Miss)*, обычный, просто уменьшенный всякими гадами до 8-10px. Это кнопочка , слева выдвинется меню с размерами.

0

15

большущее спасибо

0

16

Помогите пожалуйста. Вопрос к посту №3.

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

0



Рейтинг форумов | Создать форум бесплатно