Вопрос Улучшения выдвижного блока. CSS + jQuery

Пользователь · Регистрация: 26.04.2012

Доброго дня Комрады.

В общем начинаю описывать ситуацию. Есть у меня инет магазинчик ,недавно его начал делать так что сильно не пугайтесь) , я вот тут решил сделать покрасивши свой выдвижной блог (консультант)
Вопрос вот в чем , хочу реализовать так чтобы на водишь на кнопку и она меняла картинку при клике. (две похожие картиночки у меня нарисованы специально)

Вот скелет моего блока

PHP код:



<script src="catalog/view/javascript/jquery.tabslideout.v1.2.js" type="text/javascript"></script>

PHP код:



<script type="text/javascript">

И сам JavaScript

PHP код:



<script type="text/javascript">
$(function(){
    $('.panel').tabSlideOut({                            //Класс панели
        tabHandle: '.handle',                        //Класс кнопки
        pathToTabImage: 'button.gif',                //Путь к изображению кнопки
        imageHeight: '122px',                        //Высота кнопки
        imageWidth: '40px',                        //Ширина кнопки
        tabLocation: 'right',                        //Расположение панели top - выдвигается сверху, right - выдвигается справа, bottom - выдвигается снизу, left - выдвигается слева
        speed: 300,                                //Скорость анимации
        action: 'click',                                //Метод показа click - выдвигается по клику на кнопку, hover - выдвигается при наведении курсора
        topPos: '200px',                            //Отступ сверху
        fixedPosition: false                        //Позиционирование блока false - position: absolute, true - position: fixed
    });
});
</script>

СSS.

Код HTML:

.consultant  {
    background: url("") repeat scroll 0 0 transparent;
    border: 1px solid #6E6E6E;
    color: #6E6E6E;
    padding: 5px;
    width: 200px;

Пользователь · Регистрация: 26.04.2012

Что то глухо так все ребзя) Все в работе что-ли? не найдется мастер ломастер) который с легкостью бы сказал бы! да я все знаю и помогу тебе бро) ?

Модератор · Регистрация: 08.11.2011

Я лично,не понял вопроса.
Понял только что хотите сделать css кнопки. но не предоставили информации. например что за движок. и тд

Пользователь · Регистрация: 19.01.2012

Цитата:

Сообщение от Smiles

например что за движок

это самописный же

Модератор · Регистрация: 08.11.2011

Цитата:

Сообщение от MarKoLLl

это самописный же

Ну это я уже понял) 2ip рулит ^_^

Пользователь · Регистрация: 26.04.2012

Мир всем.

Ребят от того какое OS стоит сути не меняет ведь везде одни стандарты..

В общем я вот так подумал и все таки решил сделать по иному пути..
Нарисовал нормальную кнопку и нет проблем!
Хотя все же они есть...
В общем хочу сделать полупрозрачный этот выдвижной блог! но не просто так... а так чтобы кнопка оставалась не полупрозрачная а нормальная..

И ещё Нюансик, хочу реализовать так чтобы на водишь на кнопку и она меняла картинку. (две похожие картиночки у меня нарисованы специально)

помогите найти решения. Ох вектор надежды только на Вас))

Модератор · Регистрация: 08.11.2011

Ну как сделать полупрозрачным вот. htmlbook.ru - Полупрозрачный фон

А к чему я спрашивал. про движок. потому-что к каждому движку по разному прикрепляется ... хотя и код один.

Пользователь · Регистрация: 26.04.2012

Прикрепить то я смогу без сомнений! только вот найти бы решение... полупрозрачный фон для css врятли подойдет ибо когда его юзаю в весь блок становиться полупрозрачный.. не знаю что делать вот по этому и спрашиваю)
Вот уважаемый Vector точно знает!

Пользователь · Регистрация: 26.04.2012

НУ что же не ужели не кто не в курсе как реализоваться?
Надо ждать вектора! он то уж точно знает)

Извиняюсь что так много постов! просто я уже отписался на форумов 5

Администратор · Регистрация: 27.02.2009

Ну для начала надо html по корректнее написать...
скажем

PHP код:



<div class="consultant">
    <div class="block">
        контент левого блока
    </div>
    <div class="btn">
        <a href="">кнопка</a>
    </div>
</div>

Добавлено через 2 минуты
и CSS типа такого:

Код HTML:

.consultant .block{
    opacity:0.6;
}
.consultant .btn a{
    background:url('картинка1') no-repeat;
    width:;
    height:;
    display:block;
}
.consultant .btn a:hover{
    background:url('картинка2') no-repeat;
    width:;
    height:;
    display:block;
}

если нужны пояснения, то спрашивай

Опции темы
Версия для печати Отправить по электронной почте
Опции просмотра
Линейный вид Комбинированный вид Древовидный вид

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
FAQ Использование сервиса Я.RSS от Yandex для улучшения индексации форума на vBulletin	noname	Поисковая оптимизация (SEO, RSS)	13	03.11.2012 04:40
Модуль Раздвижное вертикальное меню на jQuery для блока CMPS	Vector	Модули для vba CMPS	0	30.09.2011 18:09
Новости Новый билд Opera 12 Wahoo: улучшения в визуализации страниц и Экспресс-панели	Jeffry Dahmer	Новости Software	0	05.09.2011 12:17
Инфо Bins — утилита для улучшения таскбара Windows 7	Vector	Windows 7	0	26.04.2011 14:29
Статья Выбор блока питания	Vector	Блоки питания, UPS (ИБП)	1	27.07.2010 10:47

MarKoLLl #4
520 МГц Пользователь Вес репутации: 0 Регистрация: 19.01.2012 Сообщений: 1,022 Сказал(а) спасибо: 40 Спасибок 218 в 196 сообщениях	Re: Улучшения выдвижного блока. CSS + jQuery - 02.03.2013, 19:51 Цитата: Сообщение от Smiles например что за движок это самописный же