#javascript #html
#javascript #HTML
Вопрос:
Это код, который у меня есть до сих пор, и он расширяет div, нажимая на div сам по себе. Я пытаюсь заставить его расшириться, нажав на кнопку.
var cardActual = document.createElement('div');
cardActual.setAttribute('id', 'card_actual');
document.body.appendChild(cardActual);
var $card = document.querySelectorAll('.card');
var $cardActual = document.querySelector('#card_actual');
$cardActual.position = "absolute";
var position = {};
var size = {};
//modal action stuffs
var openFSM = function (event) {
var $this = event.currentTarget;
position = $this.getBoundingClientRect();
size = {
width: window.getComputedStyle($this).width,
height: window.getComputedStyle($this).height
}
$cardActual.style.position = "absolute";
$cardActual.style.top - position.top 'px';
$cardActual.style.left = position.left 'px';
$cardActual.style.height = size.height;
$cardActual.style.width = size.width;
$cardActual.style.margin = $this.style.margin;
setTimeout(function () {
$cardActual.innerHTML = $this.innerHTML;
var classes = $this.classList.value.split(' ');
for (var i = 0; i < classes.length; i ) {
$cardActual.classList.add(classes[i]);
}
$cardActual.classList.add('growing');
$cardActual.style.height = '100vh';
$cardActual.style.width = '100vw';
$cardActual.style.top = '0';
$cardActual.style.left = '0';
$cardActual.style.margin = '0';
}, 1);
for (var i = 0; i < $card.length; i ) {
$card[i].addEventListener("click", openFSM);
}
$cardActual.addEventListener("click", closeFSM);
Если я создам переменную $button, которая выбирает button, она создаст еще одну кнопку.
Комментарии:
2. можете ли вы попробовать переключить в javascript, который используется для отображения и скрытия.
Ответ №1:
Вызовите функцию для расширения div в событии onClick кнопки.
<button onclick="functionToExpandDiv()">Expand Div</button>