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


Изменение Размеров Слайдера

Автор 1egi0n, 28 июля 2014 14:07
слайдер движение

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

#61 Vaccina

Vaccina

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

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

Отправлено 21 Август 2014 - 02:35

Просмотр сообщенияwatches-club (20 Август 2014 - 11:55) писал:

Верно только шапка.
Проблема не решилась при удаление  

.home #header {
margin-left: -480px;
}

Необходимо в css найти все сл.блоки и удалить:
.home #header {
	margin-left: -150px;
}
.home #header {
	margin-left: -220px;
}
.home #header {
	margin-left: -384px;
}

Просмотр сообщенияBox (20 Август 2014 - 21:25) писал:

Подскажите как поставить слайдер как вы описали, с права от категорий

Вы хотите переместить имеющийся у вас слайдер или второй добавить в необходимом вам месте?

#62 watches-club

watches-club

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

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

Отправлено 21 Август 2014 - 09:24

Просмотр сообщенияVaccina (21 Август 2014 - 02:35) писал:

Необходимо в css найти все сл.блоки и удалить:
.home #header {
margin-left: -150px;
}
.home #header {
margin-left: -220px;
}
.home #header {
margin-left: -384px;
}


Спасибо!

#63 Box

Box

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

  • Пользователи
  • PipPip
  • 27 сообщений
  • ГородЛангепас

Отправлено 21 Август 2014 - 15:12

Просмотр сообщенияVaccina (21 Август 2014 - 02:35) писал:

Вы хотите переместить имеющийся у вас слайдер или второй добавить в необходимом вам месте?

Хочу имеющийся слайдер, на главной странице, переместить справа от категорий. А сверху где сейчас слайдер оставить картинку как на всех остальных страницах

#64 Alekseys

Alekseys

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

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

Отправлено 21 Август 2014 - 15:19

Просмотр сообщенияBox (21 Август 2014 - 15:12) писал:

Хочу имеющийся слайдер, на главной странице, переместить справа от категорий. А сверху где сейчас слайдер оставить картинку как на всех остальных страницах
Здравствуйте. Уточните пожалуйста на скриншоте, где именно вы хотите разместить слайдер.

#65 Box

Box

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

  • Пользователи
  • PipPip
  • 27 сообщений
  • ГородЛангепас

Отправлено 21 Август 2014 - 15:39

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

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

Изображение

#66 Alekseys

Alekseys

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

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

Отправлено 21 Август 2014 - 16:11

Просмотр сообщенияBox (21 Август 2014 - 15:39) писал:

Изображение
Здравствуйте. В разделе Сайт -> Редактор шаблонов -> HTML найдите блок
{% IF index_page %}
	  <div class="fluid-container">
		<div class="camera_wrap camera_black_skin" id="camera_wrap_1">
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide1.jpg" data-src="{ASSETS_IMAGES_PATH}slide1.jpg">
			<div class="camera_caption moveFromLeft">
			  Интернет магазин автомобильной электроники
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg">
			<div class="camera_caption moveFomRight">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg">
			<div class="camera_caption moveFromLeft">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide4.jpg" data-src="{ASSETS_IMAGES_PATH}slide4.jpg">
			<div class="camera_caption moveFomRight">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide1.jpg" data-src="{ASSETS_IMAGES_PATH}slide1.jpg">
			<div class="camera_caption fadeFromLeft">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg">
			<div class="camera_caption fadeFromRight">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg">
			<div class="camera_caption fadeFromLeft">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		  <div data-thumb="{ASSETS_IMAGES_PATH}slide4.jpg" data-src="{ASSETS_IMAGES_PATH}slide4.jpg">
			<div class="camera_caption fadeFromRight">
			  Мечты становятся реальностью, когда мысли превращаются в действия!
			</div>
		  </div>
		</div><!-- #camera_wrap_1 -->
		<div class="clear"></div>
	  </div><!-- .fluid_container -->

	  {% ENDIF %}
и переместите его, поставив после строки
<div class="twelve columns omega main_part_wrapper">
затем в style.css замените
#bodyWrapper {
position: relative;
height: 100%;
}
на
#bodyWrapper {
position: relative;
height: 400px;
}
после чего блок
.home #header {
height: auto;
text-align: left;
position: absolute;
background: none;
z-index: 1000;
left: 50%;
margin-left: -600px;
}
замените на
.home #header {
position: relative;
height: 400px;
background: url('http://multibox.storeland.net/slide4.jpg') center center;
}

#67 igor-repsol

igor-repsol

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

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

Отправлено 22 Август 2014 - 08:51

Хочу изменить слайдер по высоте и ширине. Сделать его необходимо размером и вставить между шапкой и телом сайта.

Без имени-1.jpg

Просмотр сообщенияbatta (04 Август 2014 - 12:26) писал:

1)
Найдите в style.css
.fluid-container {
position: relative;
height: 600px;
}
измените на
.fluid-container {
position: relative;
height: 600px;
padding-top: 177px;
margin-bottom: 55px;
width: 1180px;
padding-left: 362px;
}
3)
Найдите в Style.css
.nav-container {
background: #ff8c00;
margin-bottom: 0px;
position: relative;
display: block;
float: left;
bottom: 0;
width: 100%;
}
Измените на
.nav-container {
background: #ff8c00;
margin-bottom: 0px;
position: relative;
display: block;
float: left;
bottom: 0;
width: 100%;
margin-top: -30px;
}
2)
В style.css
.container {
position: relative;
width: 1200px;
overflow: visible;
margin: 0 auto;
padding: 0;
}
измените на
.container {
position: relative;
width: 1200px;
overflow: visible;
margin: 0 auto;
padding: 0;
margin-left: 10px;
}
h
4)Слайдер только на главной странице, на всех остальных идут картинки.

#68 Alekseys

Alekseys

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

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

Отправлено 22 Август 2014 - 09:10

Просмотр сообщенияigor-repsol (22 Август 2014 - 08:51) писал:

Хочу изменить слайдер по высоте и ширине. Сделать его необходимо размером и вставить между шапкой и телом сайта.

Прикрепленный файл Без имени-1.jpg
Здравствуйте. В разделе Сайт -> Редактор шаблонов -> style.css замените блок
.fluid-container {
position: relative;
height: 480px;
}
на
.fluid-container {
position: relative;
height: 535px;
width: 1200px;
margin: auto;
}

#69 igor-repsol

igor-repsol

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

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

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

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

Здравствуйте. В разделе Сайт -> Редактор шаблонов -> style.css замените блок
.fluid-container {
position: relative;
height: 480px;
}
на
.fluid-container {
position: relative;
height: 535px;
width: 1200px;
margin: auto;
}

Слайдер теперь будет размером 1200 х 535 ?

#70 Alekseys

Alekseys

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

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

Отправлено 22 Август 2014 - 09:35

Просмотр сообщенияigor-repsol (22 Август 2014 - 09:18) писал:

Слайдер теперь будет размером 1200 х 535 ?
Да.

#71 igor-repsol

igor-repsol

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

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

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

При установке слайдера размером 1200 х 450 Изображение увеличивается и обрезается . Эффект виден на слайдере на исходнике есть рамка

post-8787-0-88241600-1408686667_thumb.jpg 

.fluid-container {position: relative;height: 450px;width: 1200px;margin: auto;}
.camera_wrap {height:450px!important;}


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

Да.

#72 igor-repsol

igor-repsol

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

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

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

Я не могу использовать нерабочий шаблон т.к. магазин рабочий. Но изминения мне нужны.  Кто может помочь с размером слайдера и убрать увелечение.

#73 igor-repsol

igor-repsol

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

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

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

Вопрос актуальный

Просмотр сообщенияigor-repsol (22 Август 2014 - 18:55) писал:

Я не могу использовать нерабочий шаблон т.к. магазин рабочий. Но изминения мне нужны.  Кто может помочь с размером слайдера и убрать увелечение.

#74 Сake

Сake

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

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

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

Изображения растягиваются из-за того, что слайдер принудительно заедает изображению заведомо большее разрешение. Попробуйте сделать следующее - в шаблоне "HTML" найдите код

jQuery('#camera_wrap_1').camera({
			minHeight: '400px',
			maxHeight: '600px',
			pagination: false,
			thumbnails: false,
			time: 4000
});

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

jQuery('#camera_wrap_1').camera({
			maxHeight: '450px',
			maxWidth: '1200px',
			pagination: false,
			thumbnails: false,
			time: 4000
});

#75 igor-repsol

igor-repsol

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

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

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

Просмотр сообщенияСake (23 Август 2014 - 06:42) писал:

Изображения растягиваются из-за того, что слайдер принудительно заедает изображению заведомо большее разрешение. Попробуйте сделать следующее - в шаблоне "HTML" найдите код

jQuery('#camera_wrap_1').camera({
		 minHeight: '400px',
		 maxHeight: '600px',
		 pagination: false,
		 thumbnails: false,
		 time: 4000
});

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

jQuery('#camera_wrap_1').camera({
		 maxHeight: '450px',
		 maxWidth: '1200px',
		 pagination: false,
		 thumbnails: false,
		 time: 4000
});

Без изменений

#76 Danil

Danil

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

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

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

Просмотр сообщенияigor-repsol (23 Август 2014 - 09:17) писал:

Без изменений

Здравствуйте.
В шаблоне html найдите код
	 jQuery('#camera_wrap_1').camera({
		 minHeight: '450px',
		 maxHeight: '1200px',
		 pagination: false,
	 thumbnails: false,
		 time: 4000
	 });
И замените на
	   jQuery('#camera_wrap_1').camera({
			minHeight: '450px',
			height: '450px',
			pagination: false,
		thumbnails: false,
			time: 4000
	   });
Значение   height: '450px' поменяйте на то, которое Вам подойдет.

#77 igor-repsol

igor-repsol

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

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

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

Подошло работает Спасибо Вам.

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

Здравствуйте.
В шаблоне html найдите код
	 jQuery('#camera_wrap_1').camera({
		 minHeight: '450px',
		 maxHeight: '1200px',
		 pagination: false,
	 thumbnails: false,
		 time: 4000
	 });
И замените на
	 jQuery('#camera_wrap_1').camera({
			minHeight: '450px',
			height: '450px',
			pagination: false,
		thumbnails: false,
			time: 4000
	 });
Значение   height: '450px' поменяйте на то, которое Вам подойдет.

#78 Box

Box

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

  • Пользователи
  • PipPip
  • 27 сообщений
  • ГородЛангепас

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

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

Здравствуйте. В разделе Сайт -> Редактор шаблонов -> HTML найдите блок
{% IF index_page %}
	 <div class="fluid-container">
	 <div class="camera_wrap camera_black_skin" id="camera_wrap_1">
		 <div data-thumb="{ASSETS_IMAGES_PATH}slide1.jpg" data-src="{ASSETS_IMAGES_PATH}slide1.jpg">
		 <div class="camera_caption moveFromLeft">
			 Интернет магазин автомобильной электроники
		 </div>
		 </div>
		 <div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg">
		 <div class="camera_caption moveFomRight">
			 Мечты становятся реальностью, когда мысли превращаются в действия!
		 </div>
		 </div>
		 <div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg">
		 <div class="camera_caption moveFromLeft">
			 Мечты становятся реальностью, когда мысли превращаются в действия!
		 </div>
		 </div>
		 <div data-thumb="{ASSETS_IMAGES_PATH}slide4.jpg" data-src="{ASSETS_IMAGES_PATH}slide4.jpg">
		 <div class="camera_caption moveFomRight">
			 Мечты становятся реальностью, когда мысли превращаются в действия!
		 </div>
		 </div>
		 <div data-thumb="{ASSETS_IMAGES_PATH}slide1.jpg" data-src="{ASSETS_IMAGES_PATH}slide1.jpg">
		 <div class="camera_caption fadeFromLeft">
			 Мечты становятся реальностью, когда мысли превращаются в действия!
		 </div>
		 </div>
		 <div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg">
		 <div class="camera_caption fadeFromRight">
			 Мечты становятся реальностью, когда мысли превращаются в действия!
		 </div>
		 </div>
		 <div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg">
		 <div class="camera_caption fadeFromLeft">
			 Мечты становятся реальностью, когда мысли превращаются в действия!
		 </div>
		 </div>
		 <div data-thumb="{ASSETS_IMAGES_PATH}slide4.jpg" data-src="{ASSETS_IMAGES_PATH}slide4.jpg">
		 <div class="camera_caption fadeFromRight">
			 Мечты становятся реальностью, когда мысли превращаются в действия!
		 </div>
		 </div>
	 </div><!-- #camera_wrap_1 -->
	 <div class="clear"></div>
	 </div><!-- .fluid_container -->

	 {% ENDIF %}
и переместите его, поставив после строки
<div class="twelve columns omega main_part_wrapper">
затем в style.css замените
#bodyWrapper {
position: relative;
height: 100%;
}
на
#bodyWrapper {
position: relative;
height: 400px;
}
после чего блок
.home #header {
height: auto;
text-align: left;
position: absolute;
background: none;
z-index: 1000;
left: 50%;
margin-left: -600px;
}
замените на
.home #header {
position: relative;
height: 400px;
background: url('http://multibox.storeland.net/slide4.jpg') center center;
}

Работает.

Теперь нужно установить шапку как на всех страницах и выровнять (шапка уехала немного влево)

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

  • Бе.jpg

#79 AnnaM

AnnaM

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

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

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

Просмотр сообщенияBox (25 Август 2014 - 16:52) писал:

Работает.

Теперь нужно установить шапку как на всех страницах и выровнять (шапка уехала немного влево)
1. в файле style.css замените код 
.container .four.columns {
width: 268px;
padding: 5px 5px 10px 5px;
display: inline-block;
float: left;
vertical-align: top;
}
на 
.container .four.columns {
width: 268px;
padding: 5px 5px 10px 0px;
display: inline-block;
float: left;
vertical-align: top;
}


2. в файле 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: -593px;
}

#80 AnnaM

AnnaM

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

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

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

Просмотр сообщенияBox (25 Август 2014 - 16:52) писал:

Работает.

Теперь нужно установить шапку как на всех страницах и выровнять (шапка уехала немного влево)
В файле style.css Найдите код
#bodyWrapper {
position: relative;
height: 400px;
}
и замените на этот
#bodyWrapper {
position: relative;
height: 400px;
background: url('http://multibox.storeland.net/slide4.jpg') center center;
}

Обратно в Главная


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

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

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