Динамическое изменение размера апплета Geogebra для заполнения адаптивного контейнераCSS

Разбираемся в CSS
Anonymous
Динамическое изменение размера апплета Geogebra для заполнения адаптивного контейнера

Сообщение Anonymous »

https://jsfiddle.net/ab7etkco/4/

Код: Выделить всё







#wrapperDiv {
width: 100%;
height: 100%;
}





var params = {
appName: "graphing",
width: 800,
height: 600,
showToolBar: true,
showAlgebraInput: true,
showMenuBar: true,
}
var applet = new GGBApplet(params, true)
window.addEventListener("load", function () {
applet.inject("ggb-element")
updateGGBAppletSize()
})
window.addEventListener("resize", updateGGBAppletSize)
function updateGGBAppletSize() {
const wrapperDiv = document.getElementById("wrapperDiv")
const width = wrapperDiv.offsetWidth
const height = wrapperDiv.offsetHeight

ggbApplet.setSize(width, height)

console.log(width, height)
}







Я попытался настройки ширины и высоты на 100%, а затем используя setSize , чтобы установить размер, основанный на соответствующем размерном размере из warpperdiv . Ширина правильно масштабируется, пока высота нет. Я также пытался использовать GetBoundingClientRect; но возникает та же проблема.
geogebra api https://geogebra.github.io/docs/referen ... _apps_api/

Подробнее здесь: https://stackoverflow.com/questions/794 ... -container

Вернуться в «CSS»