Как сохранить панель в нижней части страницы в IE 6,7,8 или как заставить IE перерисовать интерфейс? - PullRequest
Новая
       38

Как сохранить панель в нижней части страницы в IE 6,7,8 или как заставить IE перерисовать интерфейс?

2 голосов
/ 07 декабря 2010

Мне нужно приклеить полоску к нижней части клиентского представления в веб-браузере. Традиционно я бы использовал положение: исправлено; за исключением того, что мне нужно поддерживать мои клиенты IE 6. У меня есть очень обширный хак, чтобы приклеить панель к нижней части страницы и к содержимому, однако, когда пользователь прокручивает страницу вниз или вправо, панель остается фиксированной на странице.

Чтобы исправить эту проблему, я использую событие javascript, которое вызывается с помощью setInterval, а при запуске функции в инструментах отладки IE (8) событие запускается и изменяет атрибуты top и position left, но страница не перерисовывается элемент. Код работает, но элемент не движется, см. Ниже.

The example shown.

Как вы знаете, исправление должно работать в режиме причуд IE ... оно не может работать, если другие версии IE пытаются использовать стандарт. Поверьте мне, я пытался.

P.S. Это действительно усугубляет, потому что я также дважды проверяю поддержку IE9 ... поймите, что этот элемент не перемещается с полосами прокрутки в IE 6, 7 и 8, но перемещается в IE 9, и он по-прежнему отображает "IE Quirks Mode. " И Microsoft сказала, что этот релиз ничего не изменит, ...

Структура HTML 

<body>
    <div id="j_zoom_area" style="zoom:100%;">
        The Application area the the zoom is changed (by the bar) for accessibility...
    </div>
    <div id="j_protectorite">
        <div class="j_bar">
        <div class="j_plate">Zoom Controls, Help, Search, other misc controls</div>
        <div class="j_plate">Copyright info, privacy policy, etc...</div>
        </div>
    </div>
    <script type="text/javascript" language="javascript">
         j_doBar();
    </script>
</body>

CSS для бара https://kscserver.com/ERP-API/Style/includes.css. Особый javascript для исправления бара. 

//This controls the scrolling of the bar
function j_FixBarSlowly(){
var nTop = 0;
var nLeft = 0;

nTop = (document.body.scrollTop + document.body.clientHeight) - 67;
nLeft = document.body.scrollLeft;

//document.title = document.body.scrollTop + '+' + document.body.clientHeight + '-67' + '=' + nTop + 'px';
document.getElementById("j_protectorite").style.Top = nTop + 'px';
document.getElementById("j_protectorite").style.Left = nLeft + 'px';
document.getElementById("j_protectorite").style.Bottom = '';
document.getElementById("j_protectorite").style.Position = 'absolute';

//Ie6,7,8 hack to force redraw

}

function j_doBar() {
//j_FixBarSlowly();

//if (setInterval != undefined) {
//  setTimeout("j_doBar();",5);
//} else {
    setInterval("j_FixBarSlowly();",5);
//}
}

Ответы [ 2 ]

0 голосов
/ 29 декабря 2010

После дальнейшего тестирования лучшим решением было использовать I Frame для содержимого страницы и иметь div в нижней части содержимого страницы. Конечно, несколько настроек javascript для правильного определения размера, и у вас есть идеальное решение.

Просто для наглядности.

alt text

0 голосов
/ 07 декабря 2010

Я бы предложил использовать хак с исправлением IE, например IE7js Дина Эдвардса .

Этот скрипт запускается, когда ваша страница загружается в IE, и исправляет некоторые распространенные проблемы в старых версиях IE. В документации перечислены вещи, с которыми он имеет дело, а также position:fixed;.

Надеюсь, это поможет.

(Конечно, лучшее решение - для вашего здравого смысла - просто отказаться от попыток заставить IE6 выглядеть идентично новым браузерам и просто жить с неприлипающим нижним колонтитулом в IE6. Пока это не влияет удобство использования, я не вижу проблемы с пользователями IE6, имеющими немного менее совершенный макет страницы, но я знаю, что некоторые люди не могут позволить себе такую ​​роскошь: если ваши пользователи требуют этого, то это те, которые вам нужно слушай, а не меня!)

...