Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 21.12.2017, 05:00
Интересующийся
Отправить личное сообщение для aarka Посмотреть профиль Найти все сообщения от aarka
 
Регистрация: 18.10.2017
Сообщений: 20

Задать высоту div с помощью JS от ширины div`a
Здравствуйте, перерыл множество страниц, сам я неумеха и сложно дается понимание JS. Очень нуждаюсь в помощи. Делаю карусель с картинками для сайта, адаптивную, простенькую)
Есть блок div, у которого в css указана ширина 70%. Как мне с помощью JS задать высоту div равной 75% от ширины этого же div. Надеюсь понятно объяснил? Надеюсь на вашу помощь, заранее благодарен за любые предложения.
Ответить с цитированием
  #2 (permalink)  
Старый 21.12.2017, 09:55
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,115

Сообщение от aarka
адаптивную
Понятие адаптивности обычно не связывают со скриптами...

Вот статья по свойствам, отвечающим за размеры элемента
https://learn.javascript.ru/metrics

75% сам сможешь посчитать?
Ответить с цитированием
  #3 (permalink)  
Старый 21.12.2017, 09:55
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,055

изменение высоты элемента на js
aarka,


<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  html,body{
    height: 100%;
  }

  .slider{
    width: 70%;
    background-color: #0000FF;
  }

  </style>
  <script>
window.addEventListener("DOMContentLoaded", function() {
  var divs = document.querySelectorAll(".slider"), timer, pause = 50;
  function resizeDivs() {
    [].forEach.call(divs, function(el) {
      var width = el.offsetWidth * .75;
      el.style.height = width + "px";
    });
  }
  resizeDivs();
  window.addEventListener("resize", function() {
    window.clearTimeout(timer);
    timer = window.setTimeout(resizeDivs, pause);
  });
});
  </script>
</head>

<body>
<div class="slider"></div>

</body>
</html>
Ответить с цитированием
  #4 (permalink)  
Старый 21.12.2017, 13:15
Интересующийся
Отправить личное сообщение для aarka Посмотреть профиль Найти все сообщения от aarka
 
Регистрация: 18.10.2017
Сообщений: 20

Спасибо за помощь, все отлично работает
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вывод текста из JS файла в атрибут div на html страничке. help Kreol Общие вопросы Javascript 11 15.12.2012 12:08
задать высоту div в процентах lesh1j Events/DOM/Window 4 06.03.2012 17:17
JS задать ширину и высоту фоновой картинки andrey888 Элементы интерфейса 4 10.01.2012 17:31
Проблема с load в div и импортом стороннего кода с помощью javascript 1quick1 Events/DOM/Window 9 04.02.2011 13:16
помогите задать переменную в js bsgroupua Общие вопросы Javascript 3 01.02.2010 18:28