Silverlight, xhtml и 100% высота
У меня есть страница aspx с 1 таблицей, содержащей 2 строки:
<!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>
<style>
html, body
{
height: 100%;
}
</style>
</head>
<body>
<form id = "form1" runat = "server">
<div>
<asp:ScriptManager ID = "ScriptManager1" runat = "server">
</asp:ScriptManager>
<table style = "height:100%; width:100%">
<tr>
<td>
<img src = "img/Logo.png" />
</td>
</tr>
<tr>
<td style = "height:100%;">
<asp:Silverlight
ID = "sllUI"
runat = "server"
Source = "~/ClientBin/My.Silverlight.UI.xap"
MinimumVersion = "2.0.31005.0"
Width = "100%"
Height = "100%"
OnPluginLoaded = "sllUI_OnPluginLoaded"
PluginBackground = "Transparent"
Windowless = "true">
</asp:Silverlight>
</td>
</tr>
</table>
</div>
</form>
<body>
</html>
Таблица правильно заполняет страницу, а заполнение нижней строки увеличивается до оставшейся высоты таблицы, которую не заполняет верхняя строка, что я и хочу. Проблема в том, что элемент управления silverlight принимает высоту страницы, а не высоту строки, в которой он находится, что приводит к тому, что на моей странице появляются полосы прокрутки, потому что верхняя часть элемента управления silverlight находится вверху строки, в которой он находится. в, но это высота 100% браузера. Я не знаю, вызвано ли это моим html или silverlight. Все мои пользовательские элементы управления Silverlight настроены на автоматическую высоту и ширину. Я также пробовал использовать div вместо таблицы и получил тот же результат. Как я могу это исправить?
Я обнаружил, что (по крайней мере, в IE7) указанный мной тип документа заставляет его использовать стандартный режим IE6, но если я извлеку тип документа, он перейдет в режим причуд IE5 (я нахожу этот режим с помощью DebugBar v5.1.1) . Режим Quirks заставляет его отображаться правильно, но я думаю, что я бы предпочел избежать режима quirks, если я смогу получить правильное отображение в стандартном режиме.
Ответы 2
Попробуйте использовать какой-нибудь скрипт для определения общей высоты вашей страницы ... примерно так:
function getWindowHeight() {
var windowHeight = 0;
if (typeof(window.innerHeight) == 'number') {
windowHeight = window.innerHeight;
}
else {
if (document.documentElement && document.documentElement.clientHeight) {
windowHeight = document.documentElement.clientHeight;
}
else {
if (document.body && document.body.clientHeight) {
windowHeight = document.body.clientHeight;
}
}
}
return windowHeight;
}
Таким образом, вы можете вычесть высоту своего логотипа и правильно установить высоту своего «тела», отрегулировав ее, чтобы избежать прокрутки.
Попробуйте удалить свойства «Высота» и «Ширина» в вашем элементе управления, если вы правильно определили высоту и ширину внутреннего XAP для масштабирования (т. Е. Вы использовали «Авто»), тогда он должен учитывать, какие границы DOM он содержит. на странице.
Я испытываю такое же поведение. Включил переключатель
windowless, получаются ненужные полосы прокрутки. Элемент управления отображается правильно, а внизу есть лишнее пустое пространство (которое можно увидеть с помощью полос прокрутки). Есть ли способ избавиться от них? Я попытался поиграть с высотой в HTML DOM, но это ничего не дало :(