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


Как В Шаблоне "движение" Меняющиеся Слайды Поменять На Одну Картинку Без Движений И Уменьшить Ее Размер?

Автор lidershop(Олег), 09 сент. 2014 10:53

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

#21 dostypno

dostypno

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

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

Отправлено 11 Ноябрь 2014 - 14:39

баннер немного сместился вправо и нужно что бы по высоте он тоже был до меню.

#22 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

Отправлено 12 Ноябрь 2014 - 04:18

Как раз таки не он сместился вправо, а блок шапки сайта немного левее, так как ниже баннера все симметрично.
Чтобы слайдер начинался под шапкой сайта, в main.css найдите:
.home #header {
	background: none;
	height: auto;
	left: 50%;
	margin-left: -600px;
	position: absolute;
	text-align: left;
	z-index: 1000;
}
замените на:
.home #header {
	background: none;
	height: auto;
	margin: 0 auto;
	text-align: left;
	z-index: 1000;
}

#23 dostypno

dostypno

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

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

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

Просмотр сообщенияVaccina (12 Ноябрь 2014 - 04:18) писал:

Как раз таки не он сместился вправо, а блок шапки сайта немного левее, так как ниже баннера все симметрично.
Чтобы слайдер начинался под шапкой сайта, в main.css найдите:
.home #header {
background: none;
height: auto;
left: 50%;
margin-left: -600px;
position: absolute;
text-align: left;
z-index: 1000;
}
замените на:
.home #header {
background: none;
height: auto;
margin: 0 auto;
text-align: left;
z-index: 1000;
}
дело в том что у меня нет файла main.cssв шаблоне(, и как блок шапки поставить ровно?

#24 Dars

Dars

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

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

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

Просмотр сообщенияdostypno (12 Ноябрь 2014 - 14:16) писал:

дело в том что у меня нет файла main.cssв шаблоне(, и как блок шапки поставить ровно?
Производите изменения в style.css. Там же найдите строку:

.home #header{height: auto;text-align: left;position: absolute;background: none;z-index: 1000;left: 50%;margin-left: -600px;}

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

.home #header{height: auto;text-align: left;position: absolute;background: none;z-index: 1000;left: 50%;margin-left: -590px;}

#25 dostypno

dostypno

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

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

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

Просмотр сообщенияDars (12 Ноябрь 2014 - 14:51) писал:

Производите изменения в style.css. Там же найдите строку:

.home #header{height: auto;text-align: left;position: absolute;background: none;z-index: 1000;left: 50%;margin-left: -600px;}

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

.home #header{height: auto;text-align: left;position: absolute;background: none;z-index: 1000;left: 50%;margin-left: -590px;}
Спасибо, шапка стала на место, как теперь сделать что бы слайдер начинался под шапкой сайта?

#26 Dars

Dars

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

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

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

Просмотр сообщенияdostypno (12 Ноябрь 2014 - 16:05) писал:

Спасибо, шапка стала на место, как теперь сделать что бы слайдер начинался под шапкой сайта?
В style.css найдите строку:

.fluid-container  {position: relative;height:600px;/*min-height: 400px;background: url('http://design.autopilot-style.ru/slide4.jpg') center center;*/}

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

.fluid-container  {position: relative;height:600px;/*min-height: 400px;background: url('http://design.autopilot-style.ru/slide4.jpg') center center;*/top: 180px;}

Видимо, после этого двигать придется и всё остальное. Покажите, пожалуйста, итоговое расположение элементов на скриншоте.

#27 dostypno

dostypno

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

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

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

Просмотр сообщенияDars (12 Ноябрь 2014 - 16:26) писал:

В style.css найдите строку:

.fluid-container {position: relative;height:600px;/*min-height: 400px;background: url('http://design.autopilot-style.ru/slide4.jpg') center center;*/}

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

.fluid-container {position: relative;height:600px;/*min-height: 400px;background: url('http://design.autopilot-style.ru/slide4.jpg') center center;*/top: 180px;}

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

#28 batta

batta

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

  • Пользователи
  • PipPipPipPip
  • 1 142 сообщений
  • ГородНижний Новгород

Отправлено 12 Ноябрь 2014 - 17:02

Просмотр сообщенияdostypno (12 Ноябрь 2014 - 16:56) писал:

а картинки какого размера теперь делать, чтобы они помещались в область до ромо-блока?
Здравствуйте.
На данный момент у вас изображения размером 1180х600px. Что бы изображения были до промо блока вам нужно уменьшить слайдер до размера 1180х365px

#29 dostypno

dostypno

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

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

Отправлено 12 Ноябрь 2014 - 18:25

Сделал но изображения растянулось все равно за пределы области.(((

Просмотр сообщенияbatta (12 Ноябрь 2014 - 17:02) писал:

Здравствуйте.
На данный момент у вас изображения размером 1180х600px. Что бы изображения были до промо блока вам нужно уменьшить слайдер до размера 1180х365px
Сделал но изображения растянулось все равно за пределы области.(((

#30 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

Отправлено 13 Ноябрь 2014 - 02:37

В style.css найдите:
.fluid-container {
	height: 600px;
	position: relative;
	top: 180px;
}
замените на:
.fluid-container {
	height: 600px;
	position: relative;
}

далее найдите:
.promo_block {
	background: #000;
	top: -55px !important;
}
замените на:
.promo_block {
	background: #000;
	top: -10px !important;
}

далее найдите:
.promo_block + .contentText {
	top: -55px !important;
}
замените на:
.promo_block + .contentText {
	top: -25px !important;
}

#31 dostypno

dostypno

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

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

Отправлено 13 Ноябрь 2014 - 03:03

Просмотр сообщенияVaccina (13 Ноябрь 2014 - 02:37) писал:

В style.css найдите:
.fluid-container {
height: 600px;
position: relative;
top: 180px;
}
замените на:
.fluid-container {
height: 600px;
position: relative;
}

далее найдите:
.promo_block {
background: #000;
top: -55px !important;
}
замените на:
.promo_block {
background: #000;
top: -10px !important;
}

далее найдите:
.promo_block + .contentText {
top: -55px !important;
}
замените на:
.promo_block + .contentText {
top: -25px !important;
}
ВСЕ ПОЛЕЗЛО( http://autopilot-style.ru/

#32 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

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

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

#33 dostypno

dostypno

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

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

Отправлено 13 Ноябрь 2014 - 03:12

Просмотр сообщенияVaccina (13 Ноябрь 2014 - 03:08) писал:

возможно, вы задели структуру иного блока в стилях, отмените изменения(воспользуйтесь бэк апом) и по новой выполните инструкцию.
первая часть кода у меня такая : .fluid-container  {position: relative;height:600px;/*min-height: 400px;background: url('{ASSETS_IMAGES_PATH}slide4.jpg') center center;*/top: 180px;} может здесь что нибудь не то?

#34 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

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

нет, все правильно, это строку необходимо заменить на:
.fluid-container {
height: 600px;
position: relative;
}

#35 dostypno

dostypno

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

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

Отправлено 13 Ноябрь 2014 - 03:22

Просмотр сообщенияVaccina (13 Ноябрь 2014 - 03:16) писал:

нет, все правильно, это строку необходимо заменить на:
.fluid-container {
height: 600px;
position: relative;
}
стало на место но баннер все равно вылазит за красную линию сверху(

#36 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

Отправлено 13 Ноябрь 2014 - 03:30

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

Чтобы слайдер был ниже шапки, в style.css найдите:
.home #header {
	background: none;
	height: auto;
	left: 50%;
	margin-left: -590px;
	position: absolute;
	text-align: left;
	z-index: 1000;
}
замените на:
.home #header {
	background: none;
	height: auto;
	margin: 0 auto;
	position: relative;
	text-align: left;
	z-index: 1000;
}

далее в этом же файле ищите все дубликаты: .home #header и в данных дублирующих блоках удалите margin-left со значением

#37 dostypno

dostypno

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

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

Отправлено 13 Ноябрь 2014 - 03:33

Просмотр сообщенияVaccina (13 Ноябрь 2014 - 03:30) писал:

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

Чтобы слайдер был ниже шапки, в style.css найдите:
.home #header {
background: none;
height: auto;
left: 50%;
margin-left: -590px;
position: absolute;
text-align: left;
z-index: 1000;
}
замените на:
.home #header {
background: none;
height: auto;
margin: 0 auto;
position: relative;
text-align: left;
z-index: 1000;
}

далее в этом же файле ищите все дубликаты: .home #header и в данных дублирующих блоках удалите margin-left со значением
полностю весь код менять (home #header{height: auto;text-align: left;position: absolute;background: none;z-index: 1000;left: 50%;margin-left: -590px;})?

#38 dostypno

dostypno

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

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

Отправлено 13 Ноябрь 2014 - 03:39

Просмотр сообщенияVaccina (13 Ноябрь 2014 - 03:30) писал:

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

Чтобы слайдер был ниже шапки, в style.css найдите:
.home #header {
background: none;
height: auto;
left: 50%;
margin-left: -590px;
position: absolute;
text-align: left;
z-index: 1000;
}
замените на:
.home #header {
background: none;
height: auto;
margin: 0 auto;
position: relative;
text-align: left;
z-index: 1000;
}

далее в этом же файле ищите все дубликаты: .home #header и в данных дублирующих блоках удалите margin-left со значением
теперь у меня откуда не возьмись еще одна картинка в шапке вылезла.

#39 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

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

производите изменения корректней, вы допустили ошибку, в блоке:
#header {position: relative;height: 400px;background: url('{ASSETS_IMAGES_PATH}slide4.jpg') center center;}
..home #header {
background: none;
height: auto;
margin: 0 auto;
position: relative;
text-align: left;
z-index: 1000;
}
лишняя точка, замените его на:
#header {position: relative;height: 400px;background: url('{ASSETS_IMAGES_PATH}slide4.jpg') center center;}
.home #header {
background: none;
height: auto;
margin: 0 auto;
position: relative;
text-align: left;
z-index: 1000;
}

также в этом блоке удалите: background: url('{ASSETS_IMAGES_PATH}slide4.jpg') center center;  чтобы исчезла фоновая картинка
и удалите height: 400px; чтобы не было отступа между шапкой и слайдером

#40 dostypno

dostypno

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

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

Отправлено 13 Ноябрь 2014 - 03:52

все сделал, но теперь баннер растягивается, подскажыте пожалуйста что нужно сделать, что бы баннер был под размер картинки? 365 px в высоту.
Обратно в Изменение общей стилистики


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

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

  1. Форум владельцев интернет-магазинов
  2. → Вопросы работы сервиса StoreLand
  3. → Дизайн
  4. → Шаблон Движение
  5. → Изменение общей стилистики
  6. Privacy Policy