Гостиница «ПОРТАЛ»

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

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


Вы здесь » Гостиница «ПОРТАЛ» » Библиотека дизайнера » НАВИГАЦИЯ ПО СКРИПТАМ | Скрипты I


НАВИГАЦИЯ ПО СКРИПТАМ | Скрипты I

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

1

НАВИГАЦИЯ ПО СКРИПТАМ:

I. ГЛАВНАЯ СТРАНИЦА ФОРУМА

ЭФФЕКТЫ, УКРАШЕНИЯ:
◦ Падающий снег, листья и прочее
◦ Новогодняя гирлянда: Jpeg, Gif
Мерцающий фонарь на шапку: Gif-картинка

ШРИФТЫ ФОРУМА - В ТОМ ЧИСЛЕ НАСТРОЙКА ССЫЛОК:
◦ Основной шрифт: цвет, стиль, регистр
Настройка ссылок: цвет в состоянии покоя, цвет при наведении курсора

ФОН ФОРУМА:
◦ Самый нижний фон
◦ Фон под шапкой
◦ Фон под категориями

ПАНЕЛЬ МЕНЮ:
◦ Главная панель меню: цвет, стиль и др. настройки шрифта; фиксация, положение, цвет и др. настройки контейнера панели; свои названия в меню (вместо стандартных); вместо слов кликабельные картинки.

КНОПКИ:

Кнопки справа и слева, со всплывающим контентом [Deff]

ШАПКА:
Мерцающий фонарь на картинку: Gif-изображение

ОБЪЯВЛЕНИЕ НА ГЛАВНОЙ:
Форматирование текста
◦ Бегущая строка

УДОБСТВА:
◦ Кнопки вверх-вниз

КАТЕГОРИИ:

ПОДФОРУМЫ:
◦ Значки: новые и старые соо, важные и закрытые темы

БАННЕРЫ:
ВАРИАНТ № 1: движение по горизонтали, справа налево; располагаются в категории на главной

II. ТЕМЫ

ПРОФИЛЬ УЧАСТНИКА - ОТОБРАЖЕНИЕ В ТЕМЕ:
Аватары по умолчанию и для гостя
◦ Информация под аватаром

СООБЩЕНИЕ:
◦ Форма ответа: дизайн кнопок, цвет поля, шрифт и прочее
◦ Свёрнутый текст: фон, бордюр, шрифт
Цветной текст в сообщении

ПРОЧИЕ НАСТРОЙКИ:
◦ Выпадающий список "Модерирование темы, Перенести тему,...": фон, бордюр и прочие настройки
◦ Строка "Тему просматривают": цвет и стиль шрифта

III. СТРАНИЦА «УЧАСТНИКИ»

ЗАГОЛОВОК:
◦ Ссылка
◦ Ссылка

IV. СТРАНИЦА «ПРАВИЛА»

ЗАГОЛОВОК:
◦ Ссылка
◦ Ссылка

V. СТРАНИЦА «ПОИСК»

ЗАГОЛОВОК:
◦ Ссылка
◦ Ссылка

VI. СТРАНИЦА «ПРОФИЛЬ»

ЗАГОЛОВОК:
◦ Ссылка
◦ Ссылка

VII. СТРАНИЦА «СООБЩЕНИЯ»

ЗАГОЛОВОК:
◦ Ссылка
◦ Ссылка

VIII. СТРАНИЦА АДМИНИСТРИРОВАНИЯ

ДИЗАЙН:
◦ Цвет шрифта
◦ Цвет поля ввода

IX. ПИАР-ВХОД

ЗАГОЛОВОК:
◦ Ссылка
◦ Ссылка

ПОЛЕЗНЫЕ СОВЕТЫ:

Не рекомендуем перегружать скриптами HTML верх и HTML низ. Это тормозит работу сайта. По возможности старайтесь работать всё-таки со Структурой style.css и Цветами style_cs.css.

Код:
[b][size=16][u]Заголовок | подзаголовок[/u][/size][/b]
Код:
«Кавычки»

+1

2

БЛОК ОБЪЯВЛЕНИЯ НА ГЛАВНОЙ | Форматирование текста

ЭЛЕМЕНТЫ HTML

<EM> … </EM>  — логическое ударение (обычно отображается курсивным шрифтом)
<STRONG> … </STRONG>  — усиленное логическое ударение (обычно отображается жирным шрифтом)
<I> … </I>  — выделение текста курсивом
<B> … </B>  — выделение текста жирным шрифтом
<U> … </U>  — подчёркивание текста
<S> … </S> (или <STRIKE> … </STRIKE> )— зачёркивание текста
<BIG> … </BIG>  — увеличение шрифта
<SMALL> … </SMALL>  — уменьшение шрифта
<BLINK> … </BLINK>  — мигающий текст. Внимание! Этот тег не работает в браузере Internet Explorer версий 5 и ниже без применения JavaScript
<MARQUEE> … </MARQUEE>  — сдвигающийся по экрану текст.
<SUB> … </SUB>  — подстрочный текст. Например, H<SUB>2</SUB>O создаст текст H2O.
<SUP> … </SUP>  — надстрочный текст. Например, E=mc<SUP>2</SUP> создаст текст E=mc2.
<FONT параметры> … </FONT>  — задание параметров шрифта. У этого тега есть следующие параметры:
- COLOR=цвет — задание цвета. Цвет может быть задан в шестнадцатеричной форме как #rrggbb (первые 2 шестнадцатеричные цифры задают красную компоненту, следующие 2 — зелёную, последние 2 — синюю) или названием.
- FACE=шрифт задание гарнитуры шрифта
- SIZE=размер задание размера шрифта. Размер от 1 до 7: стандартный по умолчанию 3. Есть много способов изменить стандартный размер.
- SIZE=+изменение или SIZE=-изменение — изменение размера шрифта от стандартного. Например, +2 означает размер на 2 больше стандартного.

Например,

Сигналом к началу атаки являются
<U>три</U> <FONT SIZE="+2">больших</FONT> <FONT COLOR="green">зелёных</FONT> свистка.


создаст текст

Сигналом к началу атаки являются три больших зелёных свистка.


Ссылка: https://ru.wikipedia.org/wiki/Элементы_HTML

0

3

ЦВЕТНОЙ ТЕКСТ | коды

Белый
Код:
[color=white][b]Белый[/b][/color]
Желтый
Код:
[color=Yellow][b]Желтый[/b][/color]
Оранжевый
Код:
[color=Orange][b]Оранжевый[/b][/color]
Красный
Код:
[color=Red][b]Красный[/b][/color]
Каштановый
Код:
[color=maroon]Каштановый[/color]
Коричневый
Код:
[color=brown]Коричневый][/color]
Фиолетовый
Код:
[color=Purple][b]Фиолетовый[/b][/color]
Индиго
Код:
[color=indigo][b]Индиго[/b][/color]
Синий
Код:
[color=Blue][b]СинийГолубой[/b][/color]
Зелёный
Код:
[color=green]Зелёный[/color]
Черный
Код:
[color=Krichnevy][b]Кричневый[/b][/color]

0

4

БЕГУЩАЯ СТРОКА | для блока объявлений на Главной

Код:
<I><marquee scrollamount="5" onmouseover="this.stop()" onmouseout="this.start()"><strong>Текст (жирный шрифт) </strong>Текст (обычный шрифт)</marquee></I>


Куда вставляем КОД:

- Копируем КОД: <I><marquee scrollamount="5" onmouseover="this.stop()" onmouseout="this.start()"><strong>Текст (жирный шрифт) </strong>Текст (обычный шрифт)</marquee></I>
- Заходим в АДМИНИСТРИРОВАНИЕ
- Нажимаем НАСТРОЙКИ
- Нажимаем ОБЪЯВЛЕНИЕ
- Скопированный КОД вставляем в окно [сочетание клавиш Ctrl+V]
- Нажимаем СОХРАНИТЬ

ПОЯСНЕНИЯ:

Благодаря коду <marquee scrollamount="5" onmouseover="this.stop()" onmouseout="this.start()"> движение строки прекращается при наведении курсора.

0

5

МЕРЦАЮЩИЙ ФОНАРЬ НА ШАПКУ | Gif-картинка

http://forumfiles.ru/files/0015/7e/0f/98160.gif

Вставлять КОД в HTML верх. Изменяя в коде количество пикселей, двигаем GIF-изображение. Двигаем до тех пор, пока оно не займёт требуемое место. Наш плавающий элемент будет находиться на Шапке форума.

Код:
<img src="http://forumfiles.ru/files/0015/7e/0f/98160.gif" style="top: 55px; margin-left: 380px; position: absolute;" >


Подробнее разберём КОД:

<img src="http://forumfiles.ru/files/0015/7e/0f/98160.gif" style="top: 55px; margin-left: 380px; position: absolute;" >

1. http://forumfiles.ru/files/0015/7e/0f/98160.gif
Это ссылка на GIF-изображение нашего форума. Вместо неё вставляете свою ссылку.

2. top: 55px
Двигаем изображение вверх/вниз. Чем меньше значение, тем меньше отступ элемента от верхнего края.

3. margin-left: 380px
Настраиваем отступ от левого края. Чем меньше значение, тем ближе к левому краю наш GIF.

4. position: absolute
Свойство position — позволяет настроить положение элемента. Существует 4 его значения:
- static - значение по умолчанию.
- relative - относительное позиционирование, которое позволяет двигать элемент влево (left), вправо (right), вверх (top) и вниз (bottom).
- absolute - абсолютное позиционирование, с помощью которого можно задавать смещение элемента. С другими элементами не взаимодействует. В нашем случае - картинка будет поверх Шапки.
- fixed - привязка к области просмотра. Элемент никуда не смещается, даже если вы прокручиваете страницу.

0

6

ЦВЕТ ССЫЛКИ| при наведении курсора

Вставлять в окно Цвета style_cs.css.

Путь к Цветам style_cs.css:
- Администрирование (меню вверху)
- Свой стиль (меню слева)
- Цвета style_cs.css (прокрутить вниз, второе окно)

Код:
/* CS3.2 */
.punbb a:hover, .punbb a:focus, .punbb a:active,  .punbb-admin #pun-admain .nodefault,
.punbb-admin #punbb-admain a:hover, .punbb-admin #punbb-admain a:focus, .punbb-admin #punbb-admain a:active {
  color: #7A0101;
  }


Подробнее разберём КОД:

/* CS3.2 */
.punbb a:hover, .punbb a:focus, .punbb a:active,  .punbb-admin #pun-admain .nodefault,
.punbb-admin #punbb-admain a:hover, .punbb-admin #punbb-admain a:focus, .punbb-admin #punbb-admain a:active {
  color: #7A0101;
  }


Нас интересует только эта часть: color: #7A0101, где #7A0101 - это цветовой код HTML. Вставьте свой код и цвет изменится на тот, который вам нужен.

К сведению:
В формате кодов HTML каждый код состоит из символа "#" и 6 букв или цифр. В нашем случае код - #7A0101. Первыми двумя символами обозначается насыщенность красного цвета. Третий и четвертый символы означают насыщенность зеленого, а пятый и шестой - синего. Комбинируя разные по насыщенности оттенки красного, зеленого и синего, получаем требуемый цвет.

0

7

ПАДАЮЩИЙ СНЕГ | Символ снежинки вместо изображения

Источник сведений: http://gnatkovsky.com.ua/skript-padayushhego-snega.html

Вставлять СКРИПТ в HTML низ.

Скрипт:
Код:
<!--Падающий снег начало-->
<script type="text/javascript">
var snowmax=70;
var snowcolor=new Array("#CFC4BA","#E8E1DA","#E0D8D0","#F2EDE9","#FCF8F4","#FFFFFF","#F7F2ED")
var snowtype=new Array("Arial Black","Arial Narrow","Times","Comic Sans MS");
var snowletter="❊";
var sinkspeed=0.4; 
var snowmaxsize=25;
var snowminsize=7;
var snowingzone=1;
  
  
var snow=new Array();
var marginbottom;
var marginright;
var timer;
var i_snow=0;
var x_mv=new Array();
var crds=new Array();
var lftrght=new Array();
var browserinfos=navigator.userAgent;
var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/);
var ns6=document.getElementById&&!document.all;
var opera=browserinfos.match(/Opera/);
var browserok=ie5||ns6||opera;
function randommaker(range) {
    rand=Math.floor(range*Math.random());
    return rand;
}
function initsnow() {
    if (ie5 || opera) {
        marginbottom=document.body.clientHeight;
        marginright=document.body.clientWidth;
    }
    else if (ns6) {
        marginbottom=window.innerHeight;
        marginright=window.innerWidth;
    }
    var snowsizerange=snowmaxsize-snowminsize;
    for (i=0;i<=snowmax;i++) {
        crds[i]=0;
        lftrght[i]=Math.random()*15;
        x_mv[i]=0.03+Math.random()/10;
        snow[i]=document.getElementById("s"+i);
        snow[i].style.fontFamily=snowtype[randommaker(snowtype/length)];
        snow[i].size=randommaker(snowsizerange)+snowminsize;
        snow[i].style.fontSize=snow[i].size+"px";
        snow[i].style.color=snowcolor[randommaker(snowcolor.length)];
        snow[i].sink=sinkspeed*snow[i].size/5;
        if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
        if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
        if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
        if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
        snow[i].posy=randommaker(2*marginbottom-marginbottom-2*snow[i].size);
        snow[i].style.left=snow[i].posx+"px";
        snow[i].style.top=snow[i].posy+"px";
    }
    movesnow();
}
function movesnow() {
    for(i=0;i<=snowmax;i++) {
        crds[i]+=x_mv[i];
        snow[i].posy+=snow[i].sink;
        snow[i].style.left=snow[i].posx+lftrght[i]*Math.sin(crds[i])+"px";
        snow[i].style.top=snow[i].posy+"px";
        if (snow[i].posy>=marginbottom-2*snow[i].size || parseInt(snow[i].style.left)>(marginright-3*lftrght[i])) {
            if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)}
            if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)}
            if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4}
            if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2}
            snow[i].posy=0;
        }
    }
    var timer=setTimeout("movesnow()",50);
}
for (i=0;i<=snowmax;i++) {
    document.write("<span id='s"+i+"' style='position:absolute;top:-"+snowmaxsize+"px;'>"+snowletter+"</span>");
}
if (browserok) {
    window.onload=initsnow;
}
</script>
<!--Падающий снег конец-->

Чтобы настроить снегопад, изменяем эту часть скрипта:

var snowmax=70;

var snowcolor=new Array("#CFC4BA","#E8E1DA","#E0D8D0","#F2EDE9","#FCF8F4","#FFFFFF","#F7F2ED")

var snowtype=new Array("Arial Black","Arial Narrow","Times","Comic Sans MS");

var snowletter="❄";

var sinkspeed=0.4;

var snowmaxsize=25;

var snowminsize=7;

var snowingzone=1;


Пояснения:

var snowcolor - количество снежинок.

var snowcolor - цвета снежинок. Можно добавлять любые цвета и в любом количестве.

var snowtype - шрифты, которые будут формировать Ваши снежинки. Ситуация как и с цветами, добавлять можно по желанию и в любом количестве.

var snowletter - символ снежинки. Вместо снежинки можно другой символ или же слово и даже целый текст.

var sinkspeed - скорость падения снега. Не рекомендуется больше 3, иначе получится просто мигание.

var snowmaxsize - задается максимальный размер снежинки.

var snowminsize - наоборот, задается минимальный размер снежинки.

var snowingzone - это настройки размещения снегопада. В зависимости от числа:

1 - снег идет по всей ширине страницы.
2 - расположение снега слева.
3 - снег будет колонкой по средине.
4 - снег будет справа.


Если внизу появляется полоса прокрутки и подёргивания, добавляем код в HTML верх:

Код:
<!--Убирает полосу прокрутки из-за СНЕГОПАДА-->
<style type="text/css">
body {overflow-x:hidden;}
</style>

0

8

СТРЕЛКИ/КНОПКИ ВВЕРХ-ВНИЗ

В HTML верх

<!--Кнопки вверх вниз начало-->
<div class="go-up" id='ToTop'><img src="Сюда вставляем ссылку на картинку со стрелкой ВВЕРХ" border="0" /></div>
<div class="go-down" id='OnBottom'><img src="Сюда вставляем ссылку на картинку со стрелкой ВНИЗ" border="0" /></div>
<style>
.go-up,.go-down {
display:none;
position:fixed; /*позиционируем*/
right:15px; /*указываем положение, если слева - left*/
z-index:9999; /*показываем поверх все элементов на странице*/
cursor:pointer;
opacity: .99; /*прозрачность*/
margin-bottom:0px; /*отступ снизу (можно не указывать)*/
width:37px; /*ширина кнопки*/
height:130px; /*высота кнопки*/
}
.go-up {
bottom:115px; /*положение от низа окна браузера верхняя кнопка*/
}
.go-down {
bottom:15px; /*положение от низа окна браузера нижняя кнопка кнопка*/
}
.go-down:hover,.go-up:hover {
opacity:1;
}
</style>
<!--Кнопки вверх вниз конец-->

В HTML низ

<!--Кнопки вверх вниз с плавной прокруткой начало-->
<script type="text/javascript">
$(function(){
if ($(window).scrollTop()>="250") $("#ToTop").fadeIn("slow")
$(window).scroll(function(){
if ($(window).scrollTop()<="250") $("#ToTop").fadeOut("slow")
else $("#ToTop").fadeIn("slow")
});
if ($(window).scrollTop()<=$(document).height()-"999") $("#OnBottom").fadeIn("slow")
$(window).scroll(function(){
if ($(window).scrollTop()>=$(document).height()-"999") $("#OnBottom").fadeOut("slow")
else $("#OnBottom").fadeIn("slow")
});
$("#ToTop").click(function(){$("html,body").animate({scrollTop:0},"slow")})
$("#OnBottom").click(function(){$("html,body").animate({scrollTop:$(document).height()},"slow")})
});
</script>
<!--Кнопки вверх вниз с плавной прокруткой конец-->

Пояснения:
Скрипт работает корректно, если в скрипте для HTML верх заменить символы стрелок ⇧ ⇩ на картинки.

0

9

БАННЕРЫ | Варианты

ВАРИАНТ № 1 «ДВИЖЕНИЕ ПО ГОРИЗОНТАЛИ, СПРАВА НАЛЕВО»

Если нужно разместить под названием подфорума (на главной), чтобы баннеры были видны на главной странице.

ИНСТРУКЦИЯ:

Заходим в Администрирование, затем: из списка выбираем Форумы → ищем нужную Категорию с подфорумами → находим в списке Подфорум, в котором рекламный отдел → нажать Редактирование →  вставляем код в Описание (HTML)

КОД:

Код:
<br><marquee scrollamount="5" onmouseover="this.stop()" onmouseout="this.start()"><img src="Здесь ссылка на рекламный баннер № 1"> <img src="Здесь ссылка на рекламный баннер № 2"> <img src="http://forumfiles.ru/files/0015/7e/0f/68845.jpg"> <img src="Здесь ссылка на рекламный баннер № 3"> <img src="http://forumfiles.ru/files/0015/7e/0f/51288.jpg"> <img src="Здесь ссылка на рекламный баннер № 4"> <img src="Здесь ссылка на рекламный баннер № 5"></marquee>


ПОЯСНЕНИЯ:

1.
Количество баннеров увеличиваете по мере надобности.

2.
Обратите внимание на часть кода, выделенную синим:

<br><marquee scrollamount="5" onmouseover="this.stop()" onmouseout="this.start()"><img src="Здесь ссылка на рекламный баннер № 1"> <img src="Здесь ссылка на рекламный баннер № 2">


В начале кода добавляете <br>, если над баннерами должно располагаться описание подфорума. <br> перенесёт баннеры на следующую строку.

0

10

АВАТАРЫ ПО УМОЛЧАНИЮ И ДЛЯ ГОСТЯ | Скрипты 2016 и 2018 гг, работают

Отображение аватара в профиле и в темах

В эту часть кода:
var DefAvtr = 'http://forumfiles.ru/files/0015/7e/0f/83299.jpg' - ставите свою ссылку на аватар по умолчанию.
var GuestAvtr = 'http://forumfiles.ru/files/0015/7e/0f/83299.jpg' - ставите свою ссылку на аватар Гостя.

В HTML низ
Код:
<!--Аватары по умолчанию и для гостя-->
<script type="text/javascript">
var DefAvtr = 'http://forumfiles.ru/files/0015/7e/0f/83299.jpg'; //Ссылка на аватар по умолчанию
var GuestAvtr = 'http://forumfiles.ru/files/0015/7e/0f/83299.jpg'; //Ссылка на аватар для Гостя

$('#pun-viewtopic,#pun-messages').find('.pa-title').each(function(){
  var b = DefAvtr;if($(this).text()=='Гость'){b = GuestAvtr;}
  var s='<li class="pa-avatar item2"><img class="defavtr" src="'+b+'" alt="Аватар"/></li>';
  if($(this).parent().find('.pa-avatar').html()==null)$(this).after(s);
});$('#profile-left strong:contains("Нет аватара")')
.parent().html('<div><img src="'+DefAvtr+'"/></div>');
</script>
<!--Аватары по умолчанию и для гостя-->

Ссылка на пост:

Код:
http://forum.mybb.ru/viewtopic.php?id=31044&p=18#p879509


Чтобы рядом с топиком отображался аватар

В эту часть кода:
background-image:url(http://forumfiles.ru/files/0015/7e/0f/83299.jpg - ставите свою ссылку на аватар.

В HTML верх:
Код:
<!--Аватары по умолчанию и для гостя-->
<style>
img[style*="/i/default_avatar.jpg"]{
  background-image:url(http://forumfiles.ru/files/0015/7e/0f/83299.jpg)!important;
  background-size:100%;
}
</style>
<!--Аватары по умолчанию и для гостя-->

Ссылка на пост:

Код:
http://forum.mybb.ru/viewtopic.php?id=37602&p=44#p929814

0

11

КНОПКИ СПРАВА И СЛЕВА, СО ВСПЛЫВАЮЩИМ КОНТЕНТОМ [DEFF] | На главную

Ссылка: http://forumd.ru/viewtopic.php?id=6022

Достаточно простые кнопки, зато работают.

HTML верх | Панель справа
Код:
<!--Панель справа начало-->
    <style>
    .splContR {
    width:200px!important; /*ширина окна*/
    height:auto; /*высота окна*/
    background-color:#fff !important; /*фон окна*/
    top:55px; /*отступ окна от верха кнопки*/
    right:5px; /*отступ окна от правого края монитора*/
    border:1px solid #828282; /*толщина, стиль и цвет рамки окна*/
    -moz-border-radius:8px;
    -khtml-border-radius:8px;
    -webkit-border-radius:8px;
    border-radius:8px;
    box-shadow:0 0 15px 3px #828282;
    -webkit-box-shadow:0 0 15px 3px #828282;
    -moz-box-shadow:0 0 15px 3px #828282;
    padding:10px 10px 10px 10px;
    text-align:center;
    color:#000000 !important; /*цвет шрифта*/
    font-size:12px; /*размер шрифта*/
    font-family:Georgia; /*шрифт*/
    }
    </style>

    <!--Блок с содержимым правой панели-->
    <div style="position:fixed;right:1px;top:100px;z-index:20000">
    <div class=splLinkR><img src="ссылка на картинку кнопку"/></div>
    <div style="display:none;position:absolute;" class=splContR>
    СОДЕРЖИМОЕ ПАНЕЛИ
    </div></div>

    <!--Спойлер - контейнер-->
    <script type="text/javascript">
      $(document).ready(function(){
        $('.splLinkR').click(function(){
          $(this).parent().children('div.splContR').toggle('normal');
          return false;
        });
      });
    </script>
<!--Панель справа конец-->
HTML верх | Панель слева
Код:
<!--Панель слева начало-->
    <style>
    .splContL {
    width:200px!important; /*ширина окна*/
    height:auto; /*высота окна*/
    background-color:#fff !important; /*фон окна*/
    top:55px; /*отступ окна от верха кнопки*/
    left:5px; /*отступ окна от левого края монитора*/
    border:1px solid #828282; /*толщина, стиль и цвет рамки окна*/
    -moz-border-radius:8px;
    -khtml-border-radius:8px;
    -webkit-border-radius:8px;
    border-radius:8px;
    box-shadow:0 0 15px 3px #828282;
    -webkit-box-shadow:0 0 15px 3px #828282;
    -moz-box-shadow:0 0 15px 3px #828282;
    padding:10px 10px 10px 10px;
    text-align:center;
    color:#000000 !important; /*цвет шрифта*/
    font-size:12px; /*размер шрифта*/
    font-family:Georgia; /*шрифт*/
    }
    </style>

    <!--Блок с содержимым левой панели-->
    <div style="position:fixed;left:1px;top:100px;z-index:20000">
    <div class=splLinkL><img src="ссылка на картинку кнопку"/></div>
    <div style="display:none;position:absolute;" class=splContL>
    СОДЕРЖИМОЕ ПАНЕЛИ
    </div></div>

    <!--Спойлер - контейнер-->
    <script type="text/javascript">
      $(document).ready(function(){
        $('.splLinkL').click(function(){
          $(this).parent().children('div.splContL').toggle('normal');
          return false;
        });
      });
    </script>
<!--Панель слева конец-->

0


Вы здесь » Гостиница «ПОРТАЛ» » Библиотека дизайнера » НАВИГАЦИЯ ПО СКРИПТАМ | Скрипты I