Закрепить Каталог (Слева)
#1
Отправлено 27 Сентябрь 2016 - 23:06
Подскажите пожалуйста, можно ли как то закрепить меню справа (каталог), чтобы когда скролом опускаясь вниз, меню доходила до верха экрана и закреплялось, чтобы оно не убегало за пределы экрана.
Спасибо!
#2
Отправлено 28 Сентябрь 2016 - 03:27
// fade in #back-top $(window).scroll(function () { if ($(this).scrollTop() > 100) { $('#back-top').fadeIn(); } else { $('#back-top').fadeOut(); } });замените на:
// fade in #back-top $(window).scroll(function () { if ($(this).scrollTop() > 100) { $('#back-top').fadeIn(); } else { $('#back-top').fadeOut(); } if ($(this).scrollTop() > 704) { $('#column-left > .box').css( "position", "fixed" ); $('#column-left > .box').css( "top", "100px" ); } else { $('#column-left > .box').css( "position", "relative" ); $('#column-left > .box').css( "top", "initial" ); } });
#3
Отправлено 28 Сентябрь 2016 - 08:10
#5
Отправлено 28 Сентябрь 2016 - 10:25
#8
Отправлено 28 Сентябрь 2016 - 15:55
#10
Отправлено 28 Сентябрь 2016 - 17:28
#11
Отправлено 16 Октябрь 2018 - 11:52
Помогите закрепить каталог слева. Внес все изменения которые выше всё едет куда не надо)
#12
Отправлено 16 Октябрь 2018 - 12:19
Alexey163 (16 Октябрь 2018 - 11:52) писал:
Помогите закрепить каталог слева. Внес все изменения которые выше всё едет куда не надо)
Здравствуйте.
В шаблоне main.js найдите, пожалуйста, следующий блок кода:
// fade in #back-top $(window).scroll(function () { if ($(this).scrollTop() > 100) { $('#back-top').fadeIn(); } else { $('#back-top').fadeOut(); } if ($(this).scrollTop() > 704) { $('#column-left > .box').css( "position", "fixed" ); $('#column-left > .box').css( "top", "100px" ); } else { $('#column-left > .box').css( "position", "relative" ); $('#column-left > .box').css( "top", "initial" ); } }); // scroll body to 0px on click
И замените его этим вот кодом:
// fade in #back-top $(window).scroll(function () { if ($(this).scrollTop() > 100) { $('#back-top').fadeIn(); } else { $('#back-top').fadeOut(); } if ($(this).scrollTop() > 704) { $('#column-left > .box').css( "position", "fixed" ); $('#column-left > .box').css( "top", "100px" ); $('#column-left > .box').css( "width", "12%" ); } else { $('#column-left > .box').css( "position", "relative" ); $('#column-left > .box').css( "top", "initial" ); $('#column-left > .box').css( "width", "100%" ); } }); // scroll body to 0px on click
#13
Отправлено 31 Октябрь 2018 - 10:01
встало на место по диагонали, но теперь залезает на футор
#14
Отправлено 31 Октябрь 2018 - 10:18
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
#footer {clear: both;margin-top: 30px;min-height: 100px;padding:0 0 30px 0;border-top:4px solid #333333;background-color:#f0f0f0;}
замените на:
#footer {clear: both;margin-top: 30px;min-height: 100px;padding:0 0 30px 0;border-top:4px solid #333333;background-color:#f0f0f0;z-index: 10;position: relative;}
#15
Отправлено 31 Октябрь 2018 - 10:42
#16
Отправлено 31 Октябрь 2018 - 11:03
#powered {text-align: center;clear: both;padding:8px 0;background-color:#e0e0e0;font-size:11px;}
замените на:
#powered {text-align: center;clear: both;padding:8px 0;background-color:#e0e0e0;font-size:11px;position: relative;z-index: 10;}
#17
Отправлено 31 Октябрь 2018 - 12:37
#18
Отправлено 31 Октябрь 2018 - 13:29
#19
Отправлено 01 Ноябрь 2018 - 07:55
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
#column-left .box {background-color:#ffffff;-webkit-border-radius: 5px;-moz-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;border-bottom:4px solid #e1e1e1;box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);-webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);*border: solid 1px #e1e1e1;border: solid 1px #e1e1e1\0/;}
замените на:
#column-left .box {background-color:#ffffff;-webkit-border-radius: 5px;-moz-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;border-bottom:4px solid #e1e1e1;box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);-webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1);*border: solid 1px #e1e1e1;border: solid 1px #e1e1e1\0/;max-height: 300px;overflow-y: auto;}
#20
Отправлено 01 Ноябрь 2018 - 08:38
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных