2013-06-18 37 views
7

Xin chào tôi đã tìm kiếm một chút trên internet, nhưng không tìm thấy những gì tôi thực sự đang tìm kiếm. Nhưng dù sao, những gì tôi đang tìm kiếm là một số nếu như một phần tử bị ẩn thì nó sẽ thực hiện một hành động, và sau đó nếu phần tử có thể nhìn thấy nó sẽ thực hiện một hành động khác. Trong trường hợp này, tôi đang xây dựng menu hiển thị/ẩn, khi bạn nhấp vào biểu tượng menu (với lớp ".toggle"), nó sẽ thay đổi độ mờ thành 1 và khi bạn ẩn menu, độ mờ của biểu tượng sẽ thay đổi thành 0,6 lần nữa .Jquery: nếu phần tử bị ẩn, hãy hành động?

Dưới đây là mã của tôi anyway:

$(".sidebar_menu").hide(); 
$(".sidebar li.toggle").click(function(){ 
$(".sidebar_menu").animate({width: "toggle"}, 200); 
// Here's where the code I can't figure out is gonna be. 
}); 

Hope you guys muốn giúp tôi, nó sẽ là tốt đẹp! Cảm ơn bạn.

+0

Xin lỗi bạn có thể xây dựng trên các vấn đề ? Có thể hiển thị một ví dụ trên www.jsfiddle.net? – cgatian

Trả lời

9

này làm việc cho hiddenvisible yếu tố:

$(".sidebar_menu").hide(); 
$(".sidebar li.toggle").click(function(){ 
    $(".sidebar_menu").animate({width: "toggle"}, 200, 
    function() { 
     if($(this).is(':visible')){ 
     $(".toggle").css({opacity: 1}); 
     } else if ($(this).is(':hidden')) { 
     $(".toggle").css({opacity: 0.6}); 
     }; 
    }) 
    }); 
}); 

Edit: với .toggle()

$(".sidebar_menu").hide(); 
$(".sidebar li.toggle").click(function(){ 
    $(".sidebar_menu").toggle('slow', 
    function() { 
     if($(this).is(':visible')){ 
     $(".toggle").css({opacity: 1}); 
     } else if ($(this).is(':hidden')) { 
     $(".toggle").css({opacity: 0.6}); 
     }; 
    }) 
    }); 
}); 

Ở đây bạn thấy một ví dụ nhỏ: FIDDLE

+0

Có vẻ như có Transformers với cái này (nhiều hơn đáp ứng mắt) Im chắc chắn nói .is (': nhìn thấy') sẽ làm việc nhưng tôi sẵn sàng đặt cược có nhiều đến điều này. – cgatian

+0

Nó chỉ cho tôi một lỗi:/ –

+0

vẫn còn? tôi đã chỉnh sửa câu trả lời của tôi. – supersize

Các vấn đề liên quan