Delicious Facebook RSS Feed

Window size and scrolling

Chiều nay làm window scroll thì gặp vấn đề giữa IE và W3C, ta biết chuẩn IE khác biệt so với W3C, vậy nếu với dòng code sau:
document.body.scrollLeft
Sẽ chạy bình thường trong IE, nhưng vào trong html của mình có khai báo:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
Thì giá trị luôn trả về là 0. giải thích vì từ đây html của mình sẽ tuân thủ chuẩn W3C và
document.body.scrollLeft không có hỗ trợ trong W3C. 
Giải quyết với chuẩn W3C ta phải dùng :
document.documentElement.scrollLeft
Giải quyết cross browsers: nhận diện browser cụ thể để dùng hàm tương ứng
function getScrollXY() {
  var scrOfX = 0, scrOfY = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    scrOfY = window.pageYOffset;
    scrOfX = window.pageXOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    scrOfY = document.body.scrollTop;
    scrOfX = document.body.scrollLeft;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    //IE6 standards compliant mode
    scrOfY = document.documentElement.scrollTop;
    scrOfX = document.documentElement.scrollLeft;
  }
  return [ scrOfX, scrOfY ];
} 

Đọc thêm về size: http://www.howtocreate.co.uk/tutorials/javascript/browserwindow

0 comments:

Post a Comment