jquery show/hide несколько div toggle

Question

Прежде всего спасибо, что нашли время, чтобы помочь мне с этим.

Извините за мой английский ;-)

Ну я дам вам ссылку на мой проект будет проще понять мою проблему

http://lix.in/-c20b94

Как вы можете видеть на правой стороне , у вас есть социальные панели.

Я хотел с jquery открыть панель для каждого из них (с последними фидами). Прочитав некоторые сообщения здесь, я смог заставить его работать (я не очень хорошо разбираюсь в jquery). Но у меня все еще есть проблема.

Как вы можете заметить, когда вы нажимаете на другую кнопку (facebook, youtube ...), панели выключаются/включены и т. Д., Но сама кнопка остается в активной позиции. он не возвращается в его нормальное положение. Я думаю, что это из-за проблемы переключения

КОД:

$(".link1").click(function(){ 
    $("#twittercontent, #youtubehome").hide(); 
    $("#pz_fbplugin").toggle("fast"); 
    $(this).toggleClass("active"); 
    return false; 
    $(".link2, .link3").removeClass('active'); 
    $(".link1").addClass("active"); 
}); 

$(".link2").click(function(){ 
    $("#pz_fbplugin, #youtubehome").hide(); 
    $("#twittercontent").toggle("fast"); 
    $(this).toggleClass("active"); 
     return false; 
    $(".link1, .link3").removeClass("active"); 
    $(".link2").addClass("active"); 
}); 

$(".link3").click(function(){ 
    $("#pz_fbplugin, #twittercontent").hide(); 
    $("#youtubehome").toggle("fast"); 
    $(this).toggleClass("active"); 
    return false; 
    $(".link1, .link2").removeClass("active"); 
    $(".link3").addClass("active"); 
}); 

CSS:

a.facebook {width: 46px;position: fixed; right:0; height: 130px; top: 175px; margin-right: 0; background: url("socialrudyfacebook.png")no-repeat; z-index:51} 
a.facebook:hover{width: 129px} 
a.active.facebook{width: 129px} 

a.twitter{width: 46px; position: fixed; height: 130px;right: 0; top: 317px; margin-right: 0;z-index: 51;background: url("socialrudytwitter.png")no-repeat; a-index:51} 
a.twitter:hover{ width: 129px} 
a.active.twitter{ width: 129px} 

a.youtube{width: 46px;position: fixed; height: 130px; right: 0; top: 457px ;z-index: 150; background: url("socialrudyyoutube")no-repeat; a-index:51} 
a.youtube:hover{ width: 129px} 
a.active.youtube{ width: 129px} 

Надежда это enaugh для Вас, чтобы помочь мне с этим.

Answer 1

Я думаю, ваша проблема заключается в return false. Если вы удалите его или переместите его, он должен работать. Вместо возвращения вы также можете использовать:

$(".link3").click(function(e){ 
    e.preventDefault(); 
    // your function and stuff 
}); 

Answer 2

Когда вы return false, остальная часть кода не будет отменена. Удалите его, и он будет работать, или просто для упрощения сделайте следующее.

Добавьте один и тот же класс к каждой ссылке. Как «вкладка».

Затем на каждом .click, который у вас есть, просто звоните.

$('.tab').removeClass("active"); 

И когда вы нажимаете на вкладку, вы убедитесь, что остальные вернутся в исходное состояние.

if ($(this).hasClass('active')) 
    $(this).removeClass('active'); 

Добавить эту строку в каждый .click и он должен работать

Answer 3

Move return false до конца функции. Это должно помочь.