Laman

Pages

Laman

Oct 31, 2010

Cân bằng chiều cao của phần main và phần sidebar

(Huynh Nhat Ha's Blog) --
Khi thiết kế Blogger, đôi khi chúng ta gặp trường hợp phần main và phần sidebar của trang blog ở một số template không có chiều cao bằng nhau, khiến cho blog thiếu sự cân đối.

Việc điều chỉnh chiều cao của phần main và phần sidebar có thể được thực hiện bằng việc sử dụng javascript khá đơn giản. Bạn chỉ việc đặt đoạn code bên dưới vào trước thẻ </head> là có thể giúp cho phần main và phần sidebar có cùng chiều cao rồi.
<!--Height Fixer Starts-->
&lt;script type=&#39;text/javascript&#39;&gt;
&lt;!--
onload=function() {

var mh = document.getElementById(&#39;main-wrapper&#39;).offsetHeight;
var sh = document.getElementById(&#39;sidebar-wrapper&#39;).offsetHeight;
if(sh&gt;mh) mh=sh;
document.getElementById(&#39;main-wrapper&#39;).style.height = document.getElementById(&#39;sidebar-wrapper&#39;).style.height = mh+ &#39;px&#39;
}
//--&gt;
&lt;/script&gt;
<!--Height Fixer Ends-->
Ở đây sử dụng code đã được mã hóa để tránh trường hợp Blogger gặp lỗi đối với các Template dạng Layout.

Ý nghĩa của code trên như sau: mh biểu thị chiều cao của phần main-wrapper (main height). Biến sh thể hiện giá trị chiều cao của phần sidebar-wrapper. Nếu sh cao hơn mh thì chỉ định chiều cao của phần cao hơn (cao hơn phần main một giá trị pixel nào đó) bằng với chiều cao của phần main cộng với giá trị pixel ở trên. Như vậy script này giúp kiểm tra chiều cao của hai phần và gán cho chiều cao của hai phần đều bằng nhau khi có một phần cao hơn.

No comments:

Post a Comment

Comment của bạn sẽ bị xóa nếu:
- Bạn chèn thẻ liên kết (a tag).
- Nội dung gây khó chịu cho các bạn đọc khác.
- Thắc mắc không liên quan bài viết, hãy post tại Hỏi đáp.
- P/s : Comment chê Admin xấu trai cũng sẽ bị xóa không thương tiếc :D