Сообщений в теме: 16

[emin808]

Добрый день, мы установили кнопку наверх на сайт, сейчас встала задача переместить её, помогите пожалуйста , покажите путь

[miyako]

В панели управления магазином, в разделе "Сайт" > "Редактор тем" в блоке "Стили и скрипты" находим файл main.csstemplate, открываем его и вставляем следующий код:

#back-top a {
width: 108px;
display: block;
text-align: center;
font: 11px/100% Arial, Helvetica, sans-serif;
text-transform: uppercase;
text-decoration: none;
color: #bbb;
-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;
}

замените на:

#back-top a {
width: 30px;
display: block;
text-align: center;
font: 11px/100% Arial, Helvetica, sans-serif;
text-transform: uppercase;
text-decoration: none;
color: #bbb;
-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;
}

[emin808]

да, благодарю, подравнялось ,
теперь еще выше поднять как?!

[miyako]

emin808 (20 Декабрь 2012 - 13:23) писал:

да, благодарю, подравнялось ,
теперь еще выше поднять как?!

В панели управления магазином, в разделе "Сайт" > "Редактор тем" в блоке "Стили и скрипты" находим файл main.csstemplate, открываем его и вставляем следующий код:

#back-top {
position: fixed;
bottom: 30px;
margin-left: -150px;
right: 30px;
z-index: 100;
}

замените на:

#back-top {
position: fixed;
bottom: 300px;/*изменение высота, отступ снизу*/
margin-left: -150px;
right: 30px;
z-index: 100;
}

[emin808]

да, все четко , благодарствую

[emin808]

такая деталь, когда регулируешь размер кнопки здесь


#back-top span {
width: 36px;
height: 36px;
display: block;
margin-bottom: 7px;

то она закругляется как бы, а нам желательно чтоб она была квадратная , подскажите пожалуйста как изменить данное правило ?!

[support 2.0]

emin808 (20 Декабрь 2012 - 15:03) писал:

такая деталь, когда регулируешь размер кнопки здесь


#back-top span {
width: 36px;
height: 36px;
display: block;
margin-bottom: 7px;

то она закругляется как бы, а нам желательно чтоб она была квадратная , подскажите пожалуйста как изменить данное правило ?!

Найдите в файле main.css блок

#back-top span {
width: 36px;
height: 36px;
display: block;
margin-bottom: 7px;
background: #ddd url("http://asfn.storeland.ru/web/upload/assets/images/154/153295/%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B0%20%D0%BD%D0%B0%D0%B2%D0%B5%D1%80%D1%85.png?0497") no-repeat center center;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;
}

замените его на

#back-top span {
width: 36px;
height: 36px;
display: block;
margin-bottom: 7px;
background: #ddd url("http://asfn.storeland.ru/web/upload/assets/images/154/153295/%D0%BA%D0%BD%D0%BE%D0%BF%D0%BA%D0%B0%20%D0%BD%D0%B0%D0%B2%D0%B5%D1%80%D1%85.png?0497") no-repeat center center;
-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;
}

Все закругления уберутся

[emin808]

ооо, благодарствую,

[emin808]

интересно , а можно такую функцию реализовать?!
в действии её можно посмотреть здесь

[Koderhan]

emin808 (20 Декабрь 2012 - 16:04) писал:

интересно , а можно такую функцию реализовать?!
в действии её можно посмотреть здесь

К сожалению без исходного кода кнопки затруднительно добавить кнопку на сайт.
И как правило подобные кнопки иногда могут быть лишними.
Например пользователь перейдет на начало страницы сразу нажав на кнопку, может не заметить какой то интересный товар.
Такие кнопки зачастую удобны на таких сайтах как например форум.

[emin808]

да, все понятно , благодарю

[emin808]

Будьте добры , подскажите ещё пожалуйста, как нам эту кнопку перенести в лево ?!

и как регулировать расстояние когда она появляется?!  (сейчас она рано появляется)

[Vaccina]

Для изменения положения вам необходимо в файле стилей main.css найти

#back-top {
bottom: 440px;
margin-left: -150px;
position: fixed;
right: 30px;
z-index: 100;
}

и заменить на

#back-top {
bottom: 440px;
left: 30px;
margin-right: -150px;
position: fixed;
z-index: 100;
}

Для изменения расстояния на котором данная кнопка появиться - вам необходимо в шаблоне "HTML" найти строку

($(this).scrollTop() > 50)

и изменить в данной строке "50" на необходимо кол-во пикселей.

[emin808]

да, благодарю, все отлично ,

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

http://asfn.storelan...в-краудфандинге

[emin808]

[Vaccina]

Попробуйте удалить дубликат кода из файла main.js

$(document).ready(function(){
				$("#back-top").hide();
				$(function () {
						$(window).scroll(function () {
								if ($(this).scrollTop() > 250) {
										$('#back-top').fadeIn();
								} else {
										$('#back-top').fadeOut();
								}
						});
						$('#back-top a').click(function () {
								$('body,html').animate({
										scrollTop: 0
								}, 800);
								return false;
						});
				});
		});

данный код у вас так же вставлен в шаблоне "HTML".

[emin808]

о да!, отлично, Благодарствую