Hallo !
Om een popup te gebruiken in een HTML file gebruik ik een variant afgeleid van http://www.pat-burt.com/web-development/how-to-do-a-css-popup-without-opening-a-new-window/ . De js-code daarin gebruikt echter absolute waarden voor de afmetingen van de popup-div. In het geval van die link is dat 300px voor zowel de hoogte als de breedte van de popup-div. Om de popup de positioneren berekent men de top en de left aan de hand van de afmetingen van de popup in verhouding tot de afmetingen van de viewport.
Ik wil echter een js-functie schrijven die de top en left van de popup-div berekent op aan de hand van de afmetingen van de popup-div ongeacht de waarde van die afmetingen, en daar loopt het fout. Na allerlei pogingen kom ik tot de volgende vaststelling: Als ik aan een div bepaalde properties toeken in een style-block, dan vind ik die properties niet terug in het js style object van die div. Ter verduidelijking hierna het style block uit het html-bestand (overbodige gegevens zijn weggelaten):
Hierna de js-code (testversie):
(opmerking: de waarde van de parameter popupID is "popUpDiv", dus OK)
De waarden van alle vier de alerts() blijken een null string te zijn, wat ik ook terugvind in de debugger. Vandaar m'n cruciale vraag:
Waarom vind ik de waarden van properties, toegekend in een style block niet terug in het js-object ?
Grtz,
MDN111.
Om een popup te gebruiken in een HTML file gebruik ik een variant afgeleid van http://www.pat-burt.com/web-development/how-to-do-a-css-popup-without-opening-a-new-window/ . De js-code daarin gebruikt echter absolute waarden voor de afmetingen van de popup-div. In het geval van die link is dat 300px voor zowel de hoogte als de breedte van de popup-div. Om de popup de positioneren berekent men de top en de left aan de hand van de afmetingen van de popup in verhouding tot de afmetingen van de viewport.
Ik wil echter een js-functie schrijven die de top en left van de popup-div berekent op aan de hand van de afmetingen van de popup-div ongeacht de waarde van die afmetingen, en daar loopt het fout. Na allerlei pogingen kom ik tot de volgende vaststelling: Als ik aan een div bepaalde properties toeken in een style-block, dan vind ik die properties niet terug in het js style object van die div. Ter verduidelijking hierna het style block uit het html-bestand (overbodige gegevens zijn weggelaten):
HTML:
<style type="text/css">
...
#popUpDiv {
...
left:200px;
top:150px;
width:750px;
height:520px;
}
</style>(opmerking: de waarde van de parameter popupID is "popUpDiv", dus OK)
Code:
function SetPopup(popupID) {
var oPopupStyle = document.getElementById(popupID).style;
alert(oPopupStyle.left);
alert(oPopupStyle.top);
alert(oPopupStyle.height);
alert(oPopupStyle.width);
}De waarden van alle vier de alerts() blijken een null string te zijn, wat ik ook terugvind in de debugger. Vandaar m'n cruciale vraag:
Waarom vind ik de waarden van properties, toegekend in een style block niet terug in het js-object ?
Grtz,
MDN111.
Bijlagen
Laatst bewerkt:
