js ширина равна родительской высоте - PullRequest
Новая
       10

js ширина равна родительской высоте

0 голосов
/ 11 октября 2018

У меня есть общее меню со структурой nav > ul > li > a

Если у li есть дочернее выпадающее меню, я создаю выпадающий переключатель 

var dropdownToggle = $('<button />', {
  'class': 'dropdown-toggle',
  'aria-expanded': false
});

container.find('.menu-item-has-children > a').after(dropdownToggle);

var parentSize = dropdownToggle.parent().height();
dropdownToggle.height(parentSize);
dropdownToggle.width(parentSize);

.dropdown-toggle {
  position: absolute;
  right: 0;
  top: 0;
}

Я хочу высоту и ширину .dropdown-toggleбыть равным по высоте родителю (li), но он не работает

Где проблема?

console.log(parentSize) print 42.2 - хорошо, эта высота

Я знаю, что тамтакое решение с CSS padding-top: 100%, но я хочу использовать JS

1 Ответ

0 голосов
/ 11 октября 2018

используйте jquery следующим образом 

$('.dropdown-togggle').css({
'width':$(this).parent().width()
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

и в html добавьте класс dropdowntoggle к любому элементу, к которому вы хотите применить ширину его родителя.

...