JavaScript ie6 호환 위치:고정 구현 아이디어_javascript 기술

WBOY
풀어 주다: 2016-05-16 17:38:42
원래의
977명이 탐색했습니다.

positon:fixed를 사용하면 HTML 요소를 문서 흐름에서 분리하고 브라우저의 특정 위치에 고정할 수 있습니다.
이 위치 지정 모드를 사용하는 웹 페이지에는 부동 탐색 모음이 있는 경우가 많지만 이 위치 지정은 IE6과 호환되지 않습니다. 🎜> 플로팅 내비게이션 바의 스타일에서 중요한 것은 위치: 고정, 하단: 60px(플로팅 내비게이션의 하단은 창 하단에서 60px입니다)

코드 복사 코드는 다음과 같습니다.
.floating_9677{position:fixed; 하단:60px;}

positon:fixed는 ie6에서는 작동하지 않고 js로만 가능합니다. 먼저 ie6에서는 위치를 절대값으로 설정해야 합니다

코드를 복사하세요 코드는 다음과 같습니다:
position:fixed;bottom:60px;_position:abosulte;

추가 부동 요소에 대한 속성 식별자, js는 이 속성을 통해 이러한 부동 요소를 찾을 수 있습니다. tag="floatNavigator"
작업시 플로팅 네비게이션 바는 주로 상단이나 하단을 통해 배치됩니다.

코드 복사 코드는 다음과 같습니다.
//ie6 호환 위치: 고정
function fixPositionCompatibility (){
//ie6 브라우저가
if( $.browser.msie ||parseInt($.browser.version,10) <= 6){
var vavigators인지 확인합니다. = $(" [tag='floatNavigator']");
if(!navigators.length)return;
//각 플로팅 레이어가 상단에 고정되어 있는지 하단에 고정되어 있는지 판단하세요
$. 각각(네비게이터, 함수( ){
this.top = $(this).css("top");
this.bottom = $(this).css("bottom");
this .isTop = this.top == "auto" ? false : true;
})
window.attachEvent("onscroll", function(){
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
$.each(navigators, function(){
this.style.top = this.isTop ? scrollTop parsInt(this.top) "px" : scrollTop $(window).height () - $(this ).outerHeight() - parsInt(this.bottom) "px";
})
})
}

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿