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


Уменьшить Высоту Слайдера


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

#1 Enkha

Enkha

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

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

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

Добрый день.
Хочу сделать высоту слайдера меньше, при этом оставить ширину такой какая есть.
Я сделала и загрузила картинки размером 1920 х 543px, на мобильных устройствах все отображается замечательно.
На стационарных же компьютерах отображается кусок картинки, похоже что он полностью отображается в высоту, но в ширину показывается процентов 80.
Как сделать, чтобы на стационарных компьютерах также отображался узкой полоской и при этом сохранив адаптативность?

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

  • prtscr.jpg


#2 Castiel

Castiel

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

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

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

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

Добрый день.
Хочу сделать высоту слайдера меньше, при этом оставить ширину такой какая есть.
Я сделала и загрузила картинки размером 1920 х 543px, на мобильных устройствах все отображается замечательно.
На стационарных же компьютерах отображается кусок картинки, похоже что он полностью отображается в высоту, но в ширину показывается процентов 80.
Как сделать, чтобы на стационарных компьютерах также отображался узкой полоской и при этом сохранив адаптативность?

Здравствуйте, проверили ваш слайдер, отображение картинки идет в 100% размере.
Попробуйте почистить кэш браузера.

#3 Enkha

Enkha

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

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

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

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

Вот отдельно картинка, которую я загрузила в слайдер. Красными прямоугольниками я отметила зоны, которые не отображаются в слайдере. Т.е. слайдер картинку как бы обрезает с двух сторон, из-за этого пропорции ширина х высота нарушаются.
Я бы хотела, чтобы картинка отображалась как она есть, длинной и узкой. Как это можно сделать?

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

  • prtscr2.jpg
  • prtscr3.jpg


#4 Alekseys

Alekseys

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

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

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

Здравствуйте. Зайдите в Сайт -> Редактор шаблонов -> main.css и удалите
@media only screen and (min-width: 990px) {
  #header  .flexslider li img.slide_img{display:none !important;}
  #header  .flexslider li .bigPic {display:block !important;}
  #header.borderless {border-bottom:none;}
}


#5 Enkha

Enkha

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

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

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

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

#6 Enkha

Enkha

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

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

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

Чтобы не заводить новую тему, задам вопрос здесь.
Подскажите, хочу добавить форму обратной связи в футер. Хотелось бы сделать примерно как на картинке.
Возможно это сделать технически? И при этом не потерять адаптативность сайта?

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

  • feedback.jpg


#7 Castiel

Castiel

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

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

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

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

Чтобы не заводить новую тему, задам вопрос здесь.
Подскажите, хочу добавить форму обратной связи в футер. Хотелось бы сделать примерно как на картинке.
Возможно это сделать технически? И при этом не потерять адаптативность сайта?

Здравствуйте, в шаблоне HTML
Находим
<div class="one_fourth last column">
		  <h4>Контакты</h4>
		  <div class="footer_links">
			{% IF SETTINGS_STORE_WORK_TIME %}<span class="footer_time"  title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}">{SETTINGS_STORE_WORK_TIME}</span>{% ENDIF %}
			{% IF SETTINGS_STORE_PHONE_NUMBER1 %}<span class="footer_phone">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %}{SETTINGS_STORE_PHONE_NUMBER1}</span>{% ENDIF %}
			{% IF SETTINGS_STORE_PHONE_NUMBER2 %}<span class="footer_phone">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %}{SETTINGS_STORE_PHONE_NUMBER2}</span>{% ENDIF %}
			{% IF SETTINGS_STORE_PHONE_NUMBER3 %}<span class="footer_phone">{SETTINGS_STORE_PHONE_COUNTRY_CODE3}{% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %}{SETTINGS_STORE_PHONE_NUMBER3}</span>{% ENDIF %}
			{% IF SETTINGS_STORE_SKYPE %}<span class="footer_skype"><a href="skype:{SETTINGS_STORE_SKYPE}?call" title="Свяжитесь с нами по Skype">{SETTINGS_STORE_SKYPE}</a></span>{% ENDIF %}
			{% IF SETTINGS_STORE_ICQ %}<span class="footer_icq">{SETTINGS_STORE_ICQ}</span>{% ENDIF %}	  
		  </div>
		</div>

Заменяем на
<div class="one_fourth column">
		  <h4>Контакты</h4>
		  <div class="footer_links">
			{% IF SETTINGS_STORE_WORK_TIME %}<span class="footer_time"  title="Время работы нашего магазина: {SETTINGS_STORE_WORK_TIME}">{SETTINGS_STORE_WORK_TIME}</span>{% ENDIF %}
			{% IF SETTINGS_STORE_PHONE_NUMBER1 %}<span class="footer_phone">{SETTINGS_STORE_PHONE_COUNTRY_CODE1}{% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %}{SETTINGS_STORE_PHONE_NUMBER1}</span>{% ENDIF %}
			{% IF SETTINGS_STORE_PHONE_NUMBER2 %}<span class="footer_phone">{SETTINGS_STORE_PHONE_COUNTRY_CODE2}{% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %}{SETTINGS_STORE_PHONE_NUMBER2}</span>{% ENDIF %}
			{% IF SETTINGS_STORE_PHONE_NUMBER3 %}<span class="footer_phone">{SETTINGS_STORE_PHONE_COUNTRY_CODE3}{% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %}{SETTINGS_STORE_PHONE_NUMBER3}</span>{% ENDIF %}
			{% IF SETTINGS_STORE_SKYPE %}<span class="footer_skype"><a href="skype:{SETTINGS_STORE_SKYPE}?call" title="Свяжитесь с нами по Skype">{SETTINGS_STORE_SKYPE}</a></span>{% ENDIF %}
			{% IF SETTINGS_STORE_ICQ %}<span class="footer_icq">{SETTINGS_STORE_ICQ}</span>{% ENDIF %}	  
		  </div>
		</div>
	   
		<div class="one_fourth last column">
		  <h4>Обратная связь</h4>
		  <div class="footer_feedback">
			  {% IF FORM_NOTICE %}
	  <div class="{% IF FORM_NOTICE_IS_GOOD %}success{% ELSE %}warning{% ENDIF %}">{FORM_NOTICE | nl2br}</div>
	{% ENDIF %}
	<form method="post" action="{FEEDBACK_URL}" class="feedbackForm" enctype="multipart/form-data">
	  {% IFNOT FORM_SEND_OK %}
		<input type="hidden" name="hash" value="{HASH}" />
		<!-- Набор полей которые не видит пользователь, но видят боты. Когда они их заполняют мы точно знаем, что их прислал нам бот и мы не сохраняем подобный отзыв о товаре, а боту отправившему отзыв сообщаем, что отзыв добавлен успешно, но будет отображён здесь после прохождения модерации -->
		{ANTISPAM_CODE}
		<table class="form">
		  <tr>
			<td><label for="feedback_name" class="required">Представьтесь пожалуйста<em>*</em></label></td>
			<td><input id="feedback_name" type="text" name="form[{ANTISPAM_FORM_FIELD_NAME_FEEDBACK_NAME}]"  value="{FORM_FEEDBACK_NAME}" maxlength="50" class="required"/></td>
		  </tr>
		  <tr>
			<td><label for="feedback_email" class="required">Электронная почта<em>*</em></label></td>
			<td><input id="feedback_email" type="text"  name="form[{ANTISPAM_FORM_FIELD_NAME_FEEDBACK_EMAIL}]"  value="{FORM_FEEDBACK_EMAIL}" maxlength="255" class="required email input-text"/></td>
		  </tr>
		  <tr>
			<td><label for="feedback_message" class="required">Текст сообщения<em>*</em></label></td>
			<td><textarea id="feedback_message" rows="7" name="form[{ANTISPAM_FORM_FIELD_NAME_FEEDBACK_MESSAGE}]" class="required">{FORM_FEEDBACK_MESSAGE}</textarea></td>
		  </tr>
		</table>
	  {% ENDIF %}
	  <div class="buttons">
		<div class="right">
		  {% IFNOT FORM_SEND_OK %}<button type="submit" title="Отправить" class="button">Отправить</button>{% ENDIF %}
		</div>
	  </div>
	</form>	
		  </div>
		</div>


#8 Enkha

Enkha

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

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

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

Спасибо! Даже не ожидала так быстро получить ответ.
Получилось вот так. Поле "текст сообщения" можно сделать шире? Пыталась задать через cols но видимо я что-то делаю неправильно.

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

  • feedback1.jpg


#9 Danil

Danil

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

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

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

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

Спасибо! Даже не ожидала так быстро получить ответ.
Получилось вот так. Поле "текст сообщения" можно сделать шире? Пыталась задать через cols но видимо я что-то делаю неправильно.

Здравствуйте.
Добавьте в main.css код
.footer_feedback table.form #feedback_message {
width: 150px;
}


#10 Эля

Эля

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

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

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

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

#11 Stasya

Stasya

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

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

Отправлено 25 Октябрь 2016 - 01:06

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

Помогите уменьшить ширину слайдеров до основного содержания сайта. а то все на сайте узкое, а слайдер шире самого сайта((. не смогла самостоятельно разобраться(((
В файле jssor_slider.js найдите строку
jssor_slider1.$SetScaleWidth(Math.min(bodyWidth, 1920));
и замените ее на
jssor_slider1.$SetScaleWidth(Math.min(bodyWidth, 1170));





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

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