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


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

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

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

#81 Box

Box

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

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

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

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

В файле style.css Найдите код
#bodyWrapper {
position: relative;
height: 400px;
}
и замените на этот
#bodyWrapper {
position: relative;
height: 400px;
background: url('http://multibox.storeland.net/slide4.jpg') center center;
}

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

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;
}

Благодарю! все выравнялось.

#82 GSA0089

GSA0089

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

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

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

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

#83 Dars

Dars

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

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

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

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

Какой размер изображения у первоначального слайдера?
1900х768

#84 Валерия

Валерия

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

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

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

Просмотр сообщения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)Слайдер только на главной странице, на всех остальных идут картинки.

Не нахожу такие коды, разница в цифрах или символах...

#85 feytry

feytry

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

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

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

Подскажите- по теме выше провел изменения на сайте с шапкой и слайдером, но слайдер уходит за границы сайта вправо (как сейчас у меня на сайте), как его выровнять как тут http://multibox.storeland.ru/ ? Когда просматриваешь сайт через телефон шапка тоже уходит вправо за границы экрана. Помогите исправить!

#86 Vaccina

Vaccina

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

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

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

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

Не нахожу такие коды, разница в цифрах или символах...

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

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

Подскажите- по теме выше провел изменения на сайте с шапкой и слайдером, но слайдер уходит за границы сайта вправо (как сейчас у меня на сайте), как его выровнять как тут http://multibox.storeland.ru/ ? Когда просматриваешь сайт через телефон шапка тоже уходит вправо за границы экрана. Помогите исправить!

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

#87 Валерия

Валерия

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

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

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

речь идет об одном шаблоне, подобный код должен у вас присутствовать, значения разные, так как адаптивный дизайн и подобные блоки будут повторяться в файле, но с разными стилями.
например здесь:
.fluid-container {
position: relative;
height: 600px;
} У меня нет 600px, есть 500, 400, 380, 300, что менять? подскажите пожалуйста?

#88 Валерия

Валерия

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

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

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


Отправлено 28 July 2014 - 17:02

Изображение1egi0n (28 July 2014 - 16:07) писал:

Мучаюсь со слайдером, хочу уменьшить его по ширине и высоте. Как это сделать?В main.css:
строку:


.camera_wrap {display: none; float: left; position: relative;z-index: 0;}
замените на:


.camera_wrap {display: none;position: relative;z-index: 0;}
строку:


.camera_wrap {width: 100%;}
на


.camera_wrap {width: 80%;margin: 0 auto;}
вместо 80% можете поставить свое значение;

и в строке:


.camera_wrap {height: 600px !important;}
замените 600 на нужную вам высоту.

Все получилось, кроме .camera_wrap {height:600px!important;} нет такого кода...

#89 Ирина345

Ирина345

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

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

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

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


Отправлено 28 July 2014 - 17:02

Изображение1egi0n (28 July 2014 - 16:07) писал:

Мучаюсь со слайдером, хочу уменьшить его по ширине и высоте. Как это сделать?В main.css:
строку:


.camera_wrap {display: none; float: left; position: relative;z-index: 0;}
замените на:


.camera_wrap {display: none;position: relative;z-index: 0;}
строку:


.camera_wrap {width: 100%;}
на


.camera_wrap {width: 80%;margin: 0 auto;}
вместо 80% можете поставить свое значение;

и в строке:


.camera_wrap {height: 600px !important;}
замените 600 на нужную вам высоту.

Все получилось, кроме .camera_wrap {height:600px!important;} нет такого кода...
Здравствуйте, ищите данную строчку в style.css

#90 Валерия

Валерия

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

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

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

Просмотр сообщенияCastiel (29 Июль 2014 - 10:19) писал:

В шаблоне "HTML"
Находим и удаляем:
{% IF index_page %}
<link rel="stylesheet" type="text/css" href="{ASSETS_STYLES_PATH}camera.css">
<script type='text/javascript' src='{ASSETS_JS_PATH}camera.min.js'></script>
<script>
jQuery(function(){
jQuery('#camera_wrap_1').camera({
minHeight: '400px',
maxHeight: '600px',
pagination: false,
thumbnails: false,
time: 3000
});
});
</script>
{% ENDIF %}

Находим и удаляем:
{% 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 %}


В файле "style.css".
Найти и удалить:
.home #header{height: auto;text-align: left;position: absolute;background: none;z-index: 1000;left: 50%;margin-left: -600px;}

Здравствуйте! В HTML удалила, а в style.css не нахожу такого кода...

#91 batta

batta

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

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

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

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

Здравствуйте! В HTML удалила, а в style.css не нахожу такого кода...
Здравствуйте.
273 строчка в style.css

#92 Валерия

Валерия

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

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

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

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

Здравствуйте.
273 строчка в style.css

Спасибо огромное))) Все получилось)))

#93 VladWild

VladWild

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

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

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

Добрый день. хочу расположить слайды по такому же принципу как и писали выше.+ приложение в скрине. НО. инструкции которые даны пользователям выше не подходят мне. т.к. строчка .

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

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

  • Новый точечный рисунок.jpg

#94 Vaccina

Vaccina

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

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

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

В camera.css найдите:
.camera_fakehover {
	height: 62%;
	margin-left: 362px;
	margin-top: 174px;
	min-height: 60px;
	position: relative;
	width: 62%;
	z-index: 1;
}
замените на:
.camera_fakehover {
	height: 62%;
	min-height: 60px;
	position: relative;
	width: 100%;
	z-index: 1;
}

Далее в HTML найдите начальный код слайдера:
<div class="fluid-container">
замените на:
<div class="fluid-container container">

#95 GeekGirl

GeekGirl

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

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

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

Здравствуйте.
Пытаюсь убрать текст всплывающий поверх слайдов, но что-то не выходит.
на 1 слайдере остается всплывающая черная полоска для текста:

      <!-- Главная страница -->
      {% 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?design=movement">
            <div class="camera_caption moveFromLeft">              
            </div>
          </div>
          <div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg?design=movement">              
            </div>
          </div>
          <div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg?design=movement">            
            </div>
          </div>
          <div data-thumb="{ASSETS_IMAGES_PATH}slide4.jpg" data-src="{ASSETS_IMAGES_PATH}slide4.jpg?design=movement">            
          </div>
        </div><!-- #camera_wrap_1 -->
        <div class="clear"></div>
      </div><!-- .fluid_container -->


Если убираю из 4ой строки <div class="camera_caption moveFromLeft">, то слайдер зацикливается на 1 картинке и местами просто белый фон.

#96 Alekseys

Alekseys

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

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

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

Просмотр сообщенияGeekGirl (05 Ноябрь 2014 - 15:21) писал:

Здравствуйте.
Пытаюсь убрать текст всплывающий поверх слайдов, но что-то не выходит.
на 1 слайдере остается всплывающая черная полоска для текста:

  <!-- Главная страница -->
  {% 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?design=movement">
<div class="camera_caption moveFromLeft">   
</div>
  </div>
  <div data-thumb="{ASSETS_IMAGES_PATH}slide2.jpg" data-src="{ASSETS_IMAGES_PATH}slide2.jpg?design=movement">   
</div>
  </div>
  <div data-thumb="{ASSETS_IMAGES_PATH}slide3.jpg" data-src="{ASSETS_IMAGES_PATH}slide3.jpg?design=movement">
</div>
  </div>
  <div data-thumb="{ASSETS_IMAGES_PATH}slide4.jpg" data-src="{ASSETS_IMAGES_PATH}slide4.jpg?design=movement">
  </div>
</div><!-- #camera_wrap_1 -->
<div class="clear"></div>
  </div><!-- .fluid_container -->


Если убираю из 4ой строки <div class="camera_caption moveFromLeft">, то слайдер зацикливается на 1 картинке и местами просто белый фон.
Здравствуйте. Уточните пожалуйста номер аккаунта, на котором Вы проводите изменения.

#97 GeekGirl

GeekGirl

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

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

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

Просмотр сообщенияAlekseys (05 Ноябрь 2014 - 15:43) писал:


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

На SL-277203. Вернула обратно изменения.

#98 AnnaM

AnnaM

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

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

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

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

На SL-277203. Вернула обратно изменения.
В файле camera.css замените 
.camera_caption {
color: #fff;
}
на 
.camera_caption {
color: #fff;
display: none !important;
}

#99 GeekGirl

GeekGirl

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

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

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

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

В файле camera.css замените 
.camera_caption {
color: #fff;
}
на 
.camera_caption {
color: #fff;
display: none !important;
}
Спасибо!
Уточните, пожалуйста, это изменение сделало подложку прозрачно? Или убрало ее при каком-то условии?

#100 AnnaM

AnnaM

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

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

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

Просмотр сообщенияGeekGirl (05 Ноябрь 2014 - 17:10) писал:

Спасибо!
Уточните, пожалуйста, это изменение сделало подложку прозрачно? Или убрало ее при каком-то условии?
Этот стиль полностью скрывает тестовый блок с подложкой с сайта.
Обратно в Главная


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

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

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