Винсент, я снова отвечу, используя ваши новые требования. Поскольку вам не нужно скрывать содержимое, если оно слишком длинное, вам не нужно плавать в заголовке. Просто поместите переполнение, скрытое в тегах html и body, и установите высоту #content
на 100%. Содержимое всегда будет длиннее, чем область просмотра по высоте заголовка, но она будет скрыта и не будет вызывать полосы прокрутки.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
<style type="text/css">
body, html {
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
color: #FFF;
}
p {
margin: 0;
}
#header {
background: red;
}
#content {
position: relative;
height: 100%;
background: blue;
}
#content #positioned {
position: absolute;
top: 0;
right: 0;
}
</style>
</head>
<body>
<div id="header">
Header
<p>Header stuff</p>
</div>
<div id="content">
Content
<p>Content stuff</p>
<div id="positioned">Positioned Content</div>
</div>
</body>
</html>
Кнопка с типом «submit» перезагрузит страницу, так как submit используется для форм для отправки данных формы на сервер. Попробуйте изменить тип на кнопку. В разных браузерах кнопки по умолчанию работают по-разному, если тип не указан.
Я предполагаю, что ваш элемент ввода не должен быть кнопкой, поэтому я бы изменил его на тег кнопки.
Ваша переменная btn
должна быть var btn = document.getElementById("register");
Если модальный режим не является частью DOM, он не будет работать. Убедитесь, что HTML-код находится на той же странице, что и ваша кнопка.
Попробуйте ниже в register.html:
<jsp:element name="script">
<jsp:attribute name="type">text/javascript</jsp:attribute>
<jsp:attribute name="src">
<c:url value="/pages/js/modal_popup.js"/>
</jsp:attribute>
<jsp:body></jsp:body>
</jsp:element>