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


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

Автор velena168, 09 сент. 2012 12:41

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

#221 Alekseys

Alekseys

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

  • Пользователи
  • PipPipPipPip
  • 2 355 сообщений

Отправлено 06 Август 2014 - 17:29

Просмотр сообщенияОльга (06 Август 2014 - 17:24) писал:

Спасибо, все здорово!
Будьте любезны, подскажите еще! Кнопка "вверх" находится слева, я меняю  margin-left:50px; на margin-right:50px, но значок "вверх" просто смещается еще левее. Мне нужно, чтоб "вверх" расположился справа. Но тут есть нюанс: справа внизу стоит "живой сайт", и если мы значок "вверх" переместим вправо, то не будут ли они друг другу мешать, особенно в тот момент, когда чат задействован в переписке. Если они создают помеху друг другу, тогда пусть будет как есть. Спасибо.
Здравствуйте, можете попробовать поменять margin-left: 50px на margin-left: 90%

#222 Ольга

Ольга

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

  • Пользователи
  • PipPipPip
  • 96 сообщений
  • ГородМосква

Отправлено 06 Август 2014 - 17:34

Просмотр сообщенияAlekseys (06 Август 2014 - 17:29) писал:

Здравствуйте, можете попробовать поменять margin-left: 50px на margin-left: 90%
Действительно, вы правы!

#223 Alekseys

Alekseys

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

  • Пользователи
  • PipPipPipPip
  • 2 355 сообщений

Отправлено 06 Август 2014 - 17:40

Также, если вам мешает то, что "живой сайт" может перекрывать кнопку вверх, можете добавить в main.css в блоке
#back-top {
position: fixed;
bottom: 30px;
margin-left: 90%;
}
высоту таким образом
#back-top {
position: fixed;
bottom: 30px;
margin-left: 90%;
height: 90%;
}

#224 Ольга

Ольга

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

  • Пользователи
  • PipPipPip
  • 96 сообщений
  • ГородМосква

Отправлено 06 Август 2014 - 17:44

Просмотр сообщенияAlekseys (06 Август 2014 - 17:29) писал:

Здравствуйте, можете попробовать поменять margin-left: 50px на margin-left: 90%
Еще маленький вопрос. Слово "вверх" обрезается чатом. Его надо чуть-чуть приподнять.

Прикрепленные изображения

  • Безымянный.png

#225 AnnaM

AnnaM

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

  • Пользователи
  • PipPipPipPip
  • 1 040 сообщений

Отправлено 06 Август 2014 - 17:48

Просмотр сообщенияОльга (06 Август 2014 - 17:44) писал:

Еще маленький вопрос. Слово "вверх" обрезается чатом. Его надо чуть-чуть приподнять.
код
#back-top {
position: fixed;
bottom: 30px;
margin-left: 90%;
}
замените на 
#back-top {
position: fixed;
bottom: 36px;
margin-left: 90%;
}

#226 Ольга

Ольга

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

  • Пользователи
  • PipPipPip
  • 96 сообщений
  • ГородМосква

Отправлено 06 Август 2014 - 18:25

Просмотр сообщенияAlekseys (06 Август 2014 - 17:40) писал:

Также, если вам мешает то, что "живой сайт" может перекрывать кнопку вверх, можете добавить в main.css в блоке
#back-top {
position: fixed;
bottom: 30px;
margin-left: 90%;
}
высоту таким образом
#back-top {
position: fixed;
bottom: 30px;
margin-left: 90%;
height: 90%;
}
Премного благодарна!!!

#227 obezianka

obezianka

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

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

Отправлено 23 Ноябрь 2014 - 16:43

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

#228 Danil

Danil

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

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 23 Ноябрь 2014 - 16:46

Просмотр сообщенияobezianka (23 Ноябрь 2014 - 16:43) писал:

Помогите, пожалуйста, сделать, чтобы кнопка появлялась не сразу, а при прокручивании вниз. аккаунт 318296
Здравствуйте.
Пришлите номер аккаунта.

#229 obezianka

obezianka

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

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

Отправлено 23 Ноябрь 2014 - 20:07

аккаунт  SL-318296

#230 obezianka

obezianka

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

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

Отправлено 23 Ноябрь 2014 - 20:16

И еще после установки кнопки пропали мои слайдеры(((( Подскажите,пожалуйста, в чем ошибка. аккаунт  SL-318296

#231 MikDark

MikDark

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

  • Модераторы
  • 6 468 сообщений

Отправлено 24 Ноябрь 2014 - 10:26

Просмотр сообщенияobezianka (23 Ноябрь 2014 - 20:16) писал:

И еще после установки кнопки пропали мои слайдеры(((( Подскажите,пожалуйста, в чем ошибка. аккаунт  SL-318296
Изменения произвели, но кнопка скрываться не будет, советуем Вам найти другом скрипт кнопки Наверх.

#232 Iuhenio

Iuhenio

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

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

Отправлено 03 Апрель 2015 - 14:06

Здравствуйте! Подскажите, пожалуйста, сделал всё, как написано в инструкции, но ничего не произошло... Что можно сделать, чтобы стрелка вверх появилась? Аккаунт SL-293324

#233 RayLi

RayLi

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

  • Модераторы
  • 2 864 сообщений

Отправлено 03 Апрель 2015 - 14:56

Просмотр сообщенияIuhenio (03 Апрель 2015 - 14:06) писал:

Здравствуйте! Подскажите, пожалуйста, сделал всё, как написано в инструкции, но ничего не произошло... Что можно сделать, чтобы стрелка вверх появилась? Аккаунт SL-293324
Здравствуйте.
Попробуйте сделать следующее:
В шаблоне main.css найдите код:
td.goodsDataFormSubmitButton > input.ui-button.ui-widget.ui-state-default.ui-corner-all {
  font-size: 13px;
  font-weight: bold;
#back-top {
		position: fixed;
		bottom: 30px;
		margin-left: -150px;
		}
#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:hover {
		color: #000;
		}
#back-top span {
		width: 108px;
		height: 108px;
		display: block;
		margin-bottom: 7px;
		background: #ddd url(http://ageta.ru/images/%20%2014_2.png) 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 a:hover span {
		background-color: #777;
		}
И замените его вот этим кодом:
td.goodsDataFormSubmitButton > input.ui-button.ui-widget.ui-state-default.ui-corner-all {
  font-size: 13px;
  font-weight: bold;
}
#back-top {
		position: fixed;
		bottom: 30px;
		margin-left: -150px;
		}
#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:hover {
		color: #000;
		}
#back-top span {
		width: 108px;
		height: 108px;
		display: block;
		margin-bottom: 7px;
		background: #ddd url(http://ageta.ru/images/%20%2014_2.png) 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 a:hover span {
		background-color: #777;
		}

#234 Iuhenio

Iuhenio

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

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

Отправлено 03 Апрель 2015 - 15:14

RayLi, сделал, но ничего не изменилось...

#235 RayLi

RayLi

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

  • Модераторы
  • 2 864 сообщений

Отправлено 03 Апрель 2015 - 15:50

Просмотр сообщенияIuhenio (03 Апрель 2015 - 15:14) писал:

RayLi, сделал, но ничего не изменилось...
Здравствуйте.
Ничего не изменилось поскольку в вашем коде снова присутствует ошибка.
По инструкции вам необходимо загрузить изображение в корень сайта, в "Редактор шаблонов" (на данный момент это ваше изображение %20%2014_2.png и желательно переименовать его в up-arrow.png ), после чего вам нужно в шаблоне main.css найти снова данный код:
td.goodsDataFormSubmitButton > input.ui-button.ui-widget.ui-state-default.ui-corner-all {
  font-size: 13px;
  font-weight: bold;
}
#back-top {
				position: fixed;
				bottom: 30px;
				margin-left: -150px;
				}
#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:hover {
				color: #000;
				}
#back-top span {
				width: 108px;
				height: 108px;
				display: block;
				margin-bottom: 7px;
				background: #ddd url(http://ageta.ru/images/%20%2014_2.png) 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 a:hover span {
				background-color: #777;
				}
И заменить его вот этим кодом из инструкции, чтобы получилось следующее:
td.goodsDataFormSubmitButton > input.ui-button.ui-widget.ui-state-default.ui-corner-all {
  font-size: 13px;
  font-weight: bold;
}
#back-top {
				position: fixed;
				bottom: 30px;
				margin-left: -150px;
				}
#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:hover {
				color: #000;
				}
#back-top span {
				width: 108px;
				height: 108px;
				display: block;
				margin-bottom: 7px;
				background: #ddd url(up-arrow.png) 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 a:hover span {
				background-color: #777;
				}

#236 Iuhenio

Iuhenio

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

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

Отправлено 03 Апрель 2015 - 20:01

RayLi, загрузил картинку на сайт, переименовал в up-arrow.png, изменил ссылку, все равно ничего не получается :)

#237 RayLi

RayLi

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

  • Модераторы
  • 2 864 сообщений

Отправлено 03 Апрель 2015 - 20:11

Просмотр сообщенияIuhenio (03 Апрель 2015 - 20:01) писал:

RayLi, загрузил картинку на сайт, переименовал в up-arrow.png, изменил ссылку, все равно ничего не получается :)
В шаблоне main.css ещё раз найдите код:
td.goodsDataFormSubmitButton > input.ui-button.ui-widget.ui-state-default.ui-corner-all {
font-size: 13px;
font-weight: bold;
}
#back-top {
							 position: fixed;
							 bottom: 30px;
							 margin-left: -150px;
							 }
#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:hover {
							 color: #000;
							 }
#back-top span {
							 width: 108px;
							 height: 108px;
							 display: block;
							 margin-bottom: 7px;
							 background: #ddd url(up-arrow.png) 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 a:hover span {
							 background-color: #777;
}
И замените его вот этим вот кодом:
td.goodsDataFormSubmitButton > input.ui-button.ui-widget.ui-state-default.ui-corner-all {
font-size: 13px;
font-weight: bold;
}
#back-top {
							 position: fixed;
							 bottom: 30px;
							 margin-left: -150px;
							 }
#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:hover {
							 color: #000;
							 }
#back-top span {
							 width: 108px;
							 height: 108px;
							 display: block;
							 margin-bottom: 7px;
							 background: #ddd url({ASSETS_IMAGES_PATH}up-arrow.png) 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 a:hover span {
							 background-color: #777;
}

#238 Iuhenio

Iuhenio

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

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

Отправлено 03 Апрель 2015 - 20:28

RayLi, поменял, стрелки нету :)

#239 RayLi

RayLi

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

  • Модераторы
  • 2 864 сообщений

Отправлено 03 Апрель 2015 - 20:35

Просмотр сообщенияIuhenio (03 Апрель 2015 - 20:28) писал:

RayLi, поменял, стрелки нету :)
К сожалению у вас допущена ошибка в коде, повторите, пожалуйста, инструкцию выше.

#240 Iuhenio

Iuhenio

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

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

Отправлено 03 Апрель 2015 - 21:08

RayLi, еще раз все проверил, не нашел, да и не понимаю, как может быть ошибка, если я копирую отсюда и вставляю туда... я ведь не сам его перепечатываю :) Как я понимаю, первый код отличается от второго только строкой ({ASSETS_IMAGES_PATH}up-arrow.png)
В любом случае я ведь его копипастю :) не могли бы подсказать, где именно ошибка?
Хоть сегодня и пятница, но я трезв, как стёклышко, честное слово :)))
Обратно в Общие вопросы


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

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

  1. Форум владельцев интернет-магазинов
  2. → Повышение продаж, продвижение
  3. → Общие вопросы
  4. Privacy Policy