Bootstrap: Thiết kế đáp ứng - thi hành JS khi cửa sổ được thay đổi kích thước từ 980px thành 979px

Question

Tôi đang sử dụng Bootstrap của Twitter cuối cùng. Tôi muốn thực hiện một hàm JS nào đó (hiển thị chú giải công cụ một lần) khi chiều rộng cửa sổ của tôi thấp hơn 980px (như bạn đã biết, kích thước này Bootstrap sửa đổi Navbar và ẩn các mục menu chuẩn) - cửa sổ từ 768 đến 979, ngắn gọn . Tôi biết rằng

@media (min-width: 768px) and (max-width: 979px) {...} 

tùy chọn này có thể được sử dụng để bắt sự kiện. Tuy nhiên, nó chỉ có thể được sử dụng để thay đổi kiểu dáng thoát như

body {background-color:#ccc;} 

Và tôi cần khởi chạy chức năng JS, hoặc thêm hoặc xóa kiểu dáng cụ thể cho phần tử. Tôi đã thử:

<script> 
    window.onresize = function() { 
     if (window.outerWidth == 980) {alert('');} 
    }; 
</script> 

nhưng giải pháp này quá chậm và thậm chí treo cửa sổ trình duyệt. Vì vậy, có bất kỳ giải pháp để nắm bắt sự kiện này, khi cửa sổ được thay đổi kích cỡ để 979px từ bên GREATER và thực hiện một chức năng JS?

Nhờ tất cả!

Answer 1

outerWidth là một phương pháp, do đó bạn đang bỏ lỡ ():

if (window.outerWidth() == 980) 

Trong mọi trường hợp nếu bạn đang sử dụng jQuery:

$(window).resize(function() { 
    if ($(this).width() < 981) { 
    //do something 
    } 
});