[Доработка] Выезжающая панель

[rabb1tkhv]

важно понять сам принцип как сделать )

[AlexFisher]

да точно так-же. Имена просто сменить и всего-то делов.

С уважением.

[monax]

Посетители ветки, как считаете? С точки зрения юзабилити, стоит ли делать их с разных сторон?

Как по мне, так их не то что с разных сторон, а и вообще делать не стоит. Они не вписываются в общий дизайн сайта. Как аппендикс... :)

[madbadjack]

То, как реализовано у Алекса-Рыбака ( :) ) мне нравится, но злоупотреблять совершенно точно не стоит. Вполне можно необходимую информацию запихнуть в одну панельку.

[tirpits]

Очень понравилось... но... можно что-то придумать чтобы не было вот этого "зависания" (при переходе по страницам, раздражает появление панели над "шапкой" магазина) ???

[AlexFisher]

document ready

[tirpits]

document ready

это сообщение по поводу моего вопроса? (с "зависанием")напишите поподробней мне document ready ничего не говорит, сори...

[Yesvik]

это сообщение по поводу моего вопроса? (с "зависанием")напишите поподробней мне document ready ничего не говорит, сори...

Да, это по твоему вопросу.

Надо скрыть див, а когда страница прогрузится (по событию document ready) - отобразить...

Например так:

Найди

<div class="slide-out-div">

измени так

<div class="slide-out-div" style="display:none;">

и добавь скрипт убирающий display:none по document ready

<script type="text/javascript">
$(document).ready(function() {
$('.slide-out-div').show();
});
</script>

[tirpits]

Да, это по твоему вопросу.

Надо скрыть див, а когда страница прогрузится (по событию document ready) - отобразить...

Например так:

Найди

<div class="slide-out-div">

измени так

<div class="slide-out-div" style="display:none;">

и добавь скрипт убирающий display:none по document ready

<script type="text/javascript">
$(document).ready(function() {
$('.slide-out-div').show();
});
</script>

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

2. Вот с этим добавлением скрипта не понятно, ни чего не происходит, куда его? сори, не все еще знаю(((

[Yesvik]

2. Вот с этим добавлением скрипта не понятно, не чего не происходит, куда его? сори, не все еще знаю(((

Перед </head>

[tirpits]

Перед </head>

Перепробовал все варианты, если делаю как вы написали ... просто все пропадает... страницу перегружаю, а ссылка не появляется... кажется что здесь что-то <div class="slide-out-div" style="display:none;"> ???

[Yesvik]

кажется что здесь что-то <div class="slide-out-div" style="display:none;"> ???

Естественно здесь...

style="display:none;" - скрывает, а когда документ прогружен скрипт отображает.

Я не знаю куда и как ты вставляеш скрипт... "пробовал все варианты" - не конкретно и не убедительно.

[tirpits]

Я не знаю куда и как ты вставляеш скрипт... "пробовал все варианты" - не конкретно и не убедительно.

В catalog/view/theme/МОЯ_ТЕМА/template/common/header.tpl

Куда: перед </head>,( и после пробовал))...

Как: копирую и вставляю, сохранить, ок...

После этого функция выезжающей кнопки прекращается (не отображается)

То есть, все работает нормально, как вношу изменения (меняю <div class="slide-out-div"> на <div class="slide-out-div" style="display:none;"> добавляю скрипт <script type="text/javascript">

$(document).ready(function() {

$('.slide-out-div').show();

});

</script> перед </head>

На этом работа выезжающей панели заканчивается.((( :mellow:

И наоборот: убираю <div class="slide-out-div" style="display:none;"> ставлю <div class="slide-out-div"> все работает... но ....

[AlexFisher]

все-таки, ставить нужно перед </head> =)

еще можно попробовать заменить

<script type="text/javascript">..some_code..</script>

на

<script type="text/javascript"><!--  ..some_code..  //--></script>

найдите отличия ;)

[Yesvik]

найдите отличия ;)

Я не нахожу. Браузер для которого ставились комменты давно мертв...

[AlexFisher]

тогда ума не приложу что делать.

советую быть внимательней в таком случае.

[nrg12]

Перепробовал все варианты, если делаю как вы написали ... просто все пропадает... страницу перегружаю, а ссылка не появляется... кажется что здесь что-то <div class="slide-out-div" style="display:none;"> ???

наверно не все варианты перепробовал) на счет 2-го пункта, попробуй так:

не просто перед </head> вставить, а перед самим

<script>
$(function(){
$('.slide-out-div').tabSlideOut({
tabHandle: '.handle', //тут класс элемента
pathToTabImage: 'image/slide_out.png', //обязательно путь к изображению. Я положил в папку image, что в корне магазина
imageHeight: '122px', //Высота изображения. Обязательна
imageWidth: '40px', //Ширина. Тоже обязательно
tabLocation: 'left', //Сторона, где располагаем вкладку. left, right, top, bottom
speed: 300, //скорость анимации
action: 'click', //опции=: 'click' или 'hover', нажимаешь, или наводишь
topPos: '165px', //расположение от верхнего края/ использовать если tabLocation = left или right
leftPos: '20px', //расположение от левого края/ использовать если tabLocation = bottom или top
fixedPosition: true //опции: true - будет неподвижной при скролле, false - останется там, где ты ее поставишь.
});

});

</script>

вставь

<script type="text/javascript">
$(document).ready(function() {
$('.slide-out-div').show();
});
 </script>

и тогда у тебя должно получиться) у меня по крайней мере вышло)))

автору большое спасибо)

[vin2s]

Всё хорошо но с кодировкой что то...Ромбики и точечки в панели.

[vin2s]

Всё хорошо но с кодировкой что то...Ромбики и точечки в панели.

[rintokurinmotokiha]

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

[KNiIT]

этот мод из DLE. К сожелению для Ipad не подходят((( и айфонов!

[Neobivis]

Как можно реализовать на 1.5.3.1?

Повторяя по инструкции - не работает. Просто появляется блок с текстом на странице в том месте, куда код вставляю. И еще перестает работать слайдер на главной :(

[papay]

на 1.5.4.1 работает, автору респект

[papay]

При загрузке страницы, пока выезжающая панель грузится, её содержание высвечивается в верху страницы. Как от этого избавиться?

пример

[AlexFisher]

Выше уже обсуждалось. Копайте в сторону

$(document).ready()