Перейти к содержимому


Как На Сайте Сделать Кнопку Наверх?


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 257

#161 CrazyCat

CrazyCat

    Продвинутый пользователь

  • Модератоpы
  • 190 сообщений

Отправлено 25 Сентябрь 2013 - 13:58

Просмотр сообщенияzuikof (25 Сентябрь 2013 - 13:55) писал:

прочитал все страницы, сделал все исправления, ничего не помогает. Кнопка не появляется.
Что не так?
номер аккаунта 218825
Help!

Здравствуйте!
Подскажите, в каком браузере смотрите?

Протестировал во всех браузерах, кнопка присутствует, при прокрутке вниз страницы.
Единственное, могу посоветовать в файле main.css код
#back-top {
position: fixed;
bottom: 30px;
margin-left: -150px;
right: 1190px;
top: 555px;
}

заменить на
#back-top {
position: fixed;
bottom: 30px;
margin-left: -150px;
right: 90px;
top: 555px;
}

Но, это уже дело вкуса.

#162 zuikof

zuikof

    Новичок

  • Пользователи
  • Pip
  • 9 сообщений

Отправлено 28 Сентябрь 2013 - 23:30

Просмотр сообщенияCrazyCat (25 Сентябрь 2013 - 13:58) писал:

Здравствуйте!
Подскажите, в каком браузере смотрите?

Протестировал во всех браузерах, кнопка присутствует, при прокрутке вниз страницы.
Единственное, могу посоветовать в файле main.css код
#back-top {
position: fixed;
bottom: 30px;
margin-left: -150px;
right: 1190px;
top: 555px;
}

заменить на
#back-top {
position: fixed;
bottom: 30px;
margin-left: -150px;
right: 90px;
top: 555px;
}

Но, это уже дело вкуса.

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

Просмотр сообщенияzuikof (28 Сентябрь 2013 - 23:25) писал:

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

все, появилось, после внесенных изменений, спасибо еще раз!

#163 miyako

miyako

    Активный участник

  • Модератоpы
  • 5 372 сообщений

Отправлено 29 Сентябрь 2013 - 06:44

Просмотр сообщенияzuikof (28 Сентябрь 2013 - 23:30) писал:

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



все, появилось, после внесенных изменений, спасибо еще раз!

Попробуйте переустановить браузер Гугл Хром.

#164 admin

admin

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 504 сообщений
  • ГородСамара

Отправлено 20 Октябрь 2013 - 11:45

Добрый день!
Вопрос в следующем:
Кнопка "наверх" перестала кликаться, от чего понять не могу!

#165 sengun

sengun

    Активный участник

  • Модератоpы
  • 1 139 сообщений
  • ГородНижний Новгород

Отправлено 20 Октябрь 2013 - 13:19

Просмотр сообщенияUltraMag (20 Октябрь 2013 - 11:45) писал:

Добрый день!
Вопрос в следующем:
Кнопка "наверх" перестала кликаться, от чего понять не могу!
Здравствуйте.
Для фона сайта прописан z-index, поэтому он стал перекрывать кнопку вверх (т.е. она стала как бы под фоном, оттого и не кликабельна).
В шаблоне main.css код
#back-top {
bottom: 4%;
position: fixed;
right: 4%;
}
измените так
#back-top {
bottom: 4%;
position: fixed;
right: 4%;
z-index: 9;
}


#166 admin

admin

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 504 сообщений
  • ГородСамара

Отправлено 20 Октябрь 2013 - 13:22

Просмотр сообщенияsengun (20 Октябрь 2013 - 13:19) писал:

Здравствуйте.
Для фона сайта прописан z-index, поэтому он стал перекрывать кнопку вверх (т.е. она стала как бы под фоном, оттого и не кликабельна).
В шаблоне main.css код
#back-top {
bottom: 4%;
position: fixed;
right: 4%;
}
измените так
#back-top {
bottom: 4%;
position: fixed;
right: 4%;
z-index: 9;
}

Cпасибо большое за помощь!

#167 MadamFodjo

MadamFodjo

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 92 сообщений

Отправлено 28 Октябрь 2013 - 15:17

вроде стрелка у меня встала, но она невидима, что у меня не так www.comby-nn.ru там только "вверх" слово и все, а нужно чтоб стрелка была такого же цвета как слово


#back-top {
position: fixed;
bottom: 30px;
margin-left: -150px;
right: 30px;
}
#back-top a {
width: 108px;
display: block;
text-align: center;
font: 11px/100% Arial, Helvetica, sans-serif;
text-transform: uppercase;
text-decoration: none;
color: #990066;
-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;
}
#back-top a:hover {
color: #990066;
}
#back-t#back-top span {
-moz-transition: all 1s ease 0s;
background: url (http://st.comby-nn.r...200/strelka.jpg) no-repeat scroll center center #DDDDDD;
border-radius: 50px 50px 50px 50px;
display: block;
height: 64px;
margin-bottom: 7px;
width: 64px;
}
#back-top a:hover span {
background-color: #990066;
}

#168 miyako

miyako

    Активный участник

  • Модератоpы
  • 5 372 сообщений

Отправлено 28 Октябрь 2013 - 15:36

Просмотр сообщенияMadamFodjo (28 Октябрь 2013 - 15:17) писал:

вроде стрелка у меня встала, но она невидима, что у меня не так www.comby-nn.ru там только "вверх" слово и все, а нужно чтоб стрелка была такого же цвета как слово


#back-top {
position: fixed;
bottom: 30px;
margin-left: -150px;
right: 30px;
}
#back-top a {
width: 108px;
display: block;
text-align: center;
font: 11px/100% Arial, Helvetica, sans-serif;
text-transform: uppercase;
text-decoration: none;
color: #990066;
-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;
}
#back-top a:hover {
color: #990066;
}
#back-t#back-top span {
-moz-transition: all 1s ease 0s;
background: url (http://st.comby-nn.r...200/strelka.jpg) no-repeat scroll center center #DDDDDD;
border-radius: 50px 50px 50px 50px;
display: block;
height: 64px;
margin-bottom: 7px;
width: 64px;
}
#back-top a:hover span {
background-color: #990066;
}

Код в main.css -
#back-t#back-top span {
	-moz-transition: all 1s ease 0s;
		background: url (http://st.comby-nn.ru/1/830/200/strelka.jpg) no-repeat scroll center center #DDDDDD;
		border-radius: 50px 50px 50px 50px;
	display: block;
	height: 64px;
	margin-bottom: 7px;
	width: 64px;
}
замените на -
#back-top span {
	-moz-transition: all 1s ease 0s;
		background: url (http://st.comby-nn.ru/1/830/200/strelka.jpg) no-repeat scroll center center #DDDDDD;
		border-radius: 50px 50px 50px 50px;
	display: block;
	height: 64px;
	margin-bottom: 7px;
	width: 64px;
}

Также сама стрелка прозрачна и может не видна на белом фоне

#169 obezianka

obezianka

    Пользователь

  • Пользователи
  • PipPip
  • 36 сообщений

Отправлено 31 Октябрь 2013 - 16:40

Здравствуйте! Изучила все страницы, вроде все сделала правильно, кнопка не появляется ((( Номер аккаунта 243646

#170 Сake

Сake

    Активный участник

  • Модератоpы
  • 5 979 сообщений

Отправлено 01 Ноябрь 2013 - 01:22

У вас присутствует синтаксическая ошибка в файле стилей main.css. Найдите в вашем файле стилей строки

border-image: initial;
#back-top {
position: fixed;

и замените их на

border-image: initial;
}
#back-top {
position: fixed;


#171 obezianka

obezianka

    Пользователь

  • Пользователи
  • PipPip
  • 36 сообщений

Отправлено 01 Ноябрь 2013 - 10:10

Просмотр сообщенияСake (01 Ноябрь 2013 - 01:22) писал:

У вас присутствует синтаксическая ошибка в файле стилей main.css. Найдите в вашем файле стилей строки

border-image: initial;
#back-top {
position: fixed;

и замените их на

border-image: initial;
}
#back-top {
position: fixed;

Огромное спасибо!!!

#172 obezianka

obezianka

    Пользователь

  • Пользователи
  • PipPip
  • 36 сообщений

Отправлено 05 Ноябрь 2013 - 13:48

Здравствуйте еще раз))) теперь помогите, пожалуйста, сделать так: 1) чтобы кнопка появлялась не сразу, а когда прокрутишь вниз; 2) Я немного изменила размер и теперь надпись "Вверх" слева от кнопки, а хочется, чтобы была посередине.  Заранее спасибо!

#173 Сake

Сake

    Активный участник

  • Модератоpы
  • 5 979 сообщений

Отправлено 06 Ноябрь 2013 - 01:05

У вас отсутствует подключение файла main.js. Найдите в шаблоне "HTML" строки

</head>
<body>

и замените их на

<!-- Скрипты магазина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script></head>
<body>

после этого в файле стилей main.css найдите

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

и замените на

#back-top {
	bottom: 30px;
	margin-left: -150px;
	position: fixed;
	right: 30px;
	text-align: center;
}


#174 obezianka

obezianka

    Пользователь

  • Пользователи
  • PipPip
  • 36 сообщений

Отправлено 06 Ноябрь 2013 - 08:28

Просмотр сообщенияСake (06 Ноябрь 2013 - 01:05) писал:

У вас отсутствует подключение файла main.js. Найдите в шаблоне "HTML" строки

</head>
<body>

и замените их на

<!-- Скрипты магазина -->
<script type="text/javascript" src="{ASSETS_JS_PATH}main.js"></script></head>
<body>

после этого в файле стилей main.css найдите

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

и замените на

#back-top {
bottom: 30px;
margin-left: -150px;
position: fixed;
right: 30px;
text-align: center;
}

Спасибо, но кнопка все равно видна сразу, на самом верху...

#175 ne_yana

ne_yana

    Активный участник

  • Модератоpы
  • 1 190 сообщений

Отправлено 06 Ноябрь 2013 - 09:33

Просмотр сообщенияobezianka (06 Ноябрь 2013 - 08:28) писал:

Спасибо, но кнопка все равно видна сразу, на самом верху...
Здравствуйте, попробуйте в файле main.js в коде
$(document).ready(function(){
				$("#back-top").hide();
				$(function () {
						$(window).scroll(function () {
								if ($(this).scrollTop() > 50) {
										$('#back-top').fadeIn();
								} else {
										$('#back-top').fadeOut();
								}
						});
						$('#back-top a').click(function () {
								$('body,html').animate({
										scrollTop: 0
								}, 800);
								return false;
						});
				});
		});
заменить 50 на 250.

#176 obezianka

obezianka

    Пользователь

  • Пользователи
  • PipPip
  • 36 сообщений

Отправлено 06 Ноябрь 2013 - 11:59

Просмотр сообщенияne_yana (06 Ноябрь 2013 - 09:33) писал:

Здравствуйте, попробуйте в файле main.js в коде
$(document).ready(function(){
			 $("#back-top").hide();
			 $(function () {
					 $(window).scroll(function () {
							 if ($(this).scrollTop() > 50) {
									 $('#back-top').fadeIn();
							 } else {
									 $('#back-top').fadeOut();
							 }
					 });
					 $('#back-top a').click(function () {
							 $('body,html').animate({
									 scrollTop: 0
							 }, 800);
							 return false;
					 });
			 });
	 });
заменить 50 на 250.

Не помогло((( Кнопка по-прежнему сверху.

#177 ne_yana

ne_yana

    Активный участник

  • Модератоpы
  • 1 190 сообщений

Отправлено 06 Ноябрь 2013 - 14:12

Просмотр сообщенияobezianka (06 Ноябрь 2013 - 11:59) писал:

Не помогло((( Кнопка по-прежнему сверху.
Нужно заменить
$(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;
						});
				});
		});
на
});
});
$(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;
						});
				});
		});


#178 obezianka

obezianka

    Пользователь

  • Пользователи
  • PipPip
  • 36 сообщений

Отправлено 06 Ноябрь 2013 - 14:50

Просмотр сообщенияne_yana (06 Ноябрь 2013 - 14:12) писал:

Нужно заменить
$(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;
					 });
			 });
	 });
на
});
});
$(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;
					 });
			 });
	 });

К сожалению, ничего не вышло((( Кнопка на том же месте

#179 Сake

Сake

    Активный участник

  • Модератоpы
  • 5 979 сообщений

Отправлено 07 Ноябрь 2013 - 00:14

Найдите в файле main.js строку

$("#deliveryConvenientDate").datepicker({

и замените её на

});
$("#deliveryConvenientDate").datepicker({


#180 obezianka

obezianka

    Пользователь

  • Пользователи
  • PipPip
  • 36 сообщений

Отправлено 07 Ноябрь 2013 - 08:13

Просмотр сообщенияСake (07 Ноябрь 2013 - 00:14) писал:

Найдите в файле main.js строку

$("#deliveryConvenientDate").datepicker({

и замените её на

});
$("#deliveryConvenientDate").datepicker({

Не помогло((((




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных