Интернет магазин шабонов
Форма входа

Бесплатный раздел

Уважаемые пользователи!
Доводим до вашего сведения, что мы не занимаемся обучениями по системе uCoz и настройками Ваших сайтов.
Подобные просьбы и вопросы - будут игнорироваться!

Новый админ-бар для uCoz

Дата добавления: 01.10.2013 - 18:22
Добавил: Buger
Количество просмотров: 645
Количество комментариев: 0
Рейтинг материала: 0.0 / 0
Новый админ-бар для uCoz
БЕСПЛАТНО
Для скачивания файлов, необходима авторизация или регистрация на нашем ресурсе.
рейтинг 0.0
/
голосов 0
Скажу сразу: это пробная версия, в дальнейшем буду стараться ее улучшать и добавлять новые админ-бары.

Описание

Итак. Я попытался создать новый админ-бар. Он полностью изменен, добавлена красивая (на мой взгляд) градиентная заливка. Изменены кнопки, они стали лучше и удобнее (как мне кажется =). Красивый эффект наведения. Убрана надоедливая фигня справа: "Использовано n мегабайт и n". А так же поставлена тень.

Установка

Перейдем к установке. Для начала вам необходимо в админ-баре поставить стандартным цветом "серый (gray)" [Общее - цвет админ-бара - серый]. Теперь скачиваем архив и заливаем два файла в папку "img". А сейчас самое простое: вставляем в свой CSS этот код: 

Код
/*=======================Новый админ-бар==============================*/

#uzadmp {
background: rgb(201,201,201);
background: -moz-linear-gradient(top, rgba(201,201,201,1) 0%, rgba(255,255,255,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(201,201,201,1)), color-stop(100%,rgba(255,255,255,1)));
background: -webkit-linear-gradient(top, rgba(201,201,201,1) 0%,rgba(255,255,255,1) 100%);
background: -o-linear-gradient(top, rgba(201,201,201,1) 0%,rgba(255,255,255,1) 100%);
background: -ms-linear-gradient(top, rgba(201,201,201,1) 0%,rgba(255,255,255,1) 100%);
background: linear-gradient(to bottom, rgba(201,201,201,1) 0%,rgba(255,255,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9c9c9', endColorstr='#ffffff',GradientType=0 ); /* Делаем градиентную заливку */
-webkit-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.4); /*Создаем тень*/
-moz-box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.4);
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.4)}  

.pbarContainer {display:none}/* Отключение "Всего использовано: ... MB*/

.admBarCenter {color:gray /*Цвет текста на кнопках в админ баре*/
  ;background:none!important/*Убирает кое-какой "баг"*/}
.admBarCenter:hover {background:url(/img/tb-btn-sprite.png)!important;border-radius:3px}/*Заменяем цвет кнопок админ-бара при наведении*/
.admBarLeft {background:none!important}/*Убираем стандартные цвета админ бара*/
.admBarLeft:hover {background:none!important}/*Заменяем цвет кнопок админ-бара при наведении*/
.admBarRight {background:none!important}/*Убираем стандартные цвета админ бара*/
.admBarRight:hover {background:none!important}/*Заменяем цвет кнопок админ-бара при наведении*/

.u-menucont {background: rgb(201,201,201);
background: -moz-linear-gradient(top, rgba(201,201,201,1) 0%, rgba(255,255,255,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(201,201,201,1)), color-stop(100%,rgba(255,255,255,1)));
background: -webkit-linear-gradient(top, rgba(201,201,201,1) 0%,rgba(255,255,255,1) 100%);
background: -o-linear-gradient(top, rgba(201,201,201,1) 0%,rgba(255,255,255,1) 100%);
background: -ms-linear-gradient(top, rgba(201,201,201,1) 0%,rgba(255,255,255,1) 100%);
background: linear-gradient(to bottom, rgba(201,201,201,1) 0%,rgba(255,255,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9c9c9', endColorstr='#ffffff',GradientType=0 )}/*Задний фон выпадающего меню*/
.u-menuvsep {display:none}/*Скрываем разделитель внутри выпадающего меню*/

.u-menubody {border:none!important;background:red} /*Убираем "границы" выпадающего меню. Похожая штучка будет ниже. Но они не одинаковые, так что не убирать!*/

.u-menuvitem {backround:url(/img/menubg.png)!important;color:gray!important;font-size:9pt}
.u-menuvitem:hover {background:#C9C9C9!important;background-size:100%}

.u-menu {border-radius:0px 0px 5px 5px!important}/* Настраиваем "рамки" выпадающего меню*/
.xw-ml {background:#B7B7B7!important}/* Настраиваем "рамки" выпадающего меню*/
.xw-bl {background:#B7B7B7!important}/* Настраиваем "рамки" выпадающего меню*/
.xw-bc {background:#B7B7B7!important}/* Настраиваем "рамки" выпадающего меню*/
.xw-footer {background:#B7B7B7!important}/* Настраиваем "рамки" выпадающего меню, как я парился, когда это находил*/
.xw-br {background:#B7B7B7!important}/* Настраиваем "рамки" выпадающего меню*/
.xw-mc {background:#B7B7B7!important;border:none!important}/* Настраиваем "рамки" выпадающего меню и убираем "границы"*/
.xw-mr {background:#B7B7B7!important}/* Настраиваем "рамки" выпадающего меню*/
.xw-tl {background:#B7B7B7!important}/* Настраиваем "рамки" выпадающего меню, а здесь у меня голова взорвалась*/
.xw-tr {background:#B7B7B7!important}/* Настраиваем "рамки" выпадающего меню*/
.xw-tc {background:#B7B7B7!important}/* Настраиваем "рамки" выпадающего меню, наконец-то!*/

/*=============================================*/

Постарался все прокомментировать. (Учусь же)

Ошибки

Так же есть один минус. Если у вас стоят другие Ajax-окна, а не стандартные, то админ-бар будет отображаться некорректно. Так как в Ajax-окнах есть стили, которые есть и в моем коде( Такая вот печаль...


Источник: Не указан
Добавлять комментарии могут только зарегистрированные пользователи.