Jump to content

Report

  • Similar Content

    • By gala
      Приветствую, уважаемые друзья программисты! Столкнулся с проблемой: не могу отследить, как происходит масштабирование элементов на сайте. При чём масштабирование идёт в Опере, Хроме и Сафари, в Файрфоксе не идёт. Джаваскрипты комментировал, стили с 55 по 3197 строки комментировал, сторонние джаваскрипты не подключены, все стили и скрипты прописаны в index.html (кроме шрифтов). Вот сайт http://амосрм-внедрение.рф (делал не я).
    • By woodoo
      Приветствую! Подскажите, пожалуйста при посадке на хостинг в хэдере не отображается картинка параллакса, хотя на локалке все работает.
      <header class="main-head bg-dark parallax-window" data-parallax="scroll" data-image-src="<?php echo get_template_directory_uri(); ?>/img/bg.jpg" data-z-index="1"> пробовал также stylesheet подставлять в get_. Может, нужно для параллакса что-то еще дописать? (в консоли 404 на картанку пишет)
    • By AlexxD
      Всем привет!
       
      Срочно ищем в офис в Москве на полную ставку отвязного frontend-разработчика с навыками джедая. Полное описание вакансии здесь: https://moikrug.ru/vacancies/1000021706
       
      Пишите на почту из текста вакансии или мне в личку.
       
    • By Радосвет
      Добрый день!
       
      Уважаемые специалисты, помогите, пожалуйста, с масштабированием картинок, у меня никак не получается сделать ровно для всех браузеров.
       
      Имеется вордпресс, в теме есть галерея с горизонтальной "прокруткой".
       
      У меня было желание настроить галерею более грамотно и удобно.
      Изначально галерея предполагает загрузку картинок одной высоты, но мне это не подходит.
      У меня вертикальные и горизонтальные фотографии, и мне нужно, чтобы они были одной высоты в галерее, при этом, чтобы вертикальные масштабировались под высоту горизонтальных.
       
      В оригинале выглядит вот так:
       
      http://demo.megathe.me/heat/portfolio/people/
       
      Код стиля:
      /* =iosSlider----------------------------------------------- */.container { position: relative; width: 100%; height: auto; margin: 0 auto; overflow: visible;}.container .iosSliderContainer { position: relative; top: 0; left: 0; width: 100%; height: auto; margin: 0 0 0 0; overflow: visible;}.iosSlider { position: relative; top: 0; left: 0; overflow: visible; width: 100%; height: auto;}.iosSlider .slider { width: 50000px; height: 100%;}.iosSlider .slider .item { float: left; width: auto;}.iosSlider .slider .item img { width: 100%; height: auto; float: left;}На моём сайте вот так:
       
      http://www.radosvet.ru/portfolio/margarita-portret/
       
      Код я немного изменил, добавив max-height: 600px:
      /* =iosSlider max-height: 600px;----------------------------------------------- */.container { position: relative; width: 100%; height: auto; margin: 0 auto; overflow: visible; max-height: 600px;}.container .iosSliderContainer { position: relative; top: 0; left: 0; width: 100%; height: auto; margin: 0 0 0 0; overflow: visible; max-height: 600px;}.iosSlider { position: relative; top: 0; left: 0; overflow: visible; width: 100%; height: auto; max-height: 600px;}.iosSlider .slider { width: 50000px; height: 100%;}.iosSlider .slider .item { float: left; width: auto;max-height: 600px;}.iosSlider .slider .item img { width: auto; height: auto; float: left; max-height: 600px; max-width: 100%;}В итоге вроде получилось то что мне нужно, но проблема в том, что при уменьшении окна вертикльные кадры "обрезаются" снизу.
       
      Я ещё дописал, добавив     min-height: 600px;:
      ----------------------------------------------- */.container { position: relative; width: 100%; height: auto; margin: 0 auto; overflow: visible; max-height: 600px; min-height: 600px;}.container .iosSliderContainer { position: relative; top: 0; left: 0; width: 100%; height: auto; margin: 0 0 0 0; overflow: visible; max-height: 600px; min-height: 600px;}.iosSlider { position: relative; top: 0; left: 0; overflow: visible; width: 100%; height: auto; max-height: 600px; min-height: 600px;}.iosSlider .slider { width: 50000px; height: 100%;}.iosSlider .slider .item { float: left; width: auto;max-height: 600px;}.iosSlider .slider .item img { width: auto; height: auto; float: left; max-height: 600px; max-width: 100%;}Теперь почти всё так, как мне нравится. Но параметр максимальной высоты не позволяет адаптивному дизайну быть на 100% рабочим.
      Например, при сужении окна по высоте картинка на экран не помещается.
      А в мобильных браузерах вообще всё как-то странно смотрится В Firefox android при пролистывании далее картинки уменьшились, в Хроме просто лента из картинок вниз (хотя этотвариант меня устраивает).
       
      Я бы хотел, чтобы всё это было красиво на всех устройствах, но не знаю как настроить контейнер и картинки.
      Помогите, пожалуйста, что можно добавить или изменить?
    • By jdk
      Добрый день.
      С простом параллакс эффектом разобрался на этом примере. Перемещение объектов при скроле тоже более-менее разобрал (на статичном фоне). Хочу сделать что бы при прокручивании в слое с параллаксом изображения (именно в этом слое) тоже перемещались. Подскажите пожалуйста где можно посмотреть материал, желательно для самых начинающих. Нашёл пару примеров, но для меня пока слишком мудрёно. Хочу что бы на выходе получилось что то вроде этого.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy