JQuery alterna usando 2 elementos - javascript, jquery, html, alternar, alternar

esse é o meu script, estou usando uma alternância para poder animar um menu deslizante.

    $("div.show-menu").click().toggle(
function() {
// first alternation
$("#slideover").animate({
right: "512px"
}, 300);
$(".menu-button").html("close menu");


}, function() {
// second alternation
$("#slideover").animate({
right: "0"
}, 300);
$(".menu-button").html("open menu");

});

Embora eu realmente precise alternar para trabalhar usando 2 elementos na página. Por exemplo, veja abaixo ...

<div class="show-menu one">open menu</div> // this is element one

<div class="show-menu two">open menu</div> // this is element two

Eu preciso disso, se o primeiro elemento clicar primeiro,você pode fechar o menu usando o elemento dois no primeiro clique. O que está acontecendo agora é que você precisa clicar no elemento dois duas vezes para fechar o menu - vice-versa

Eu acho que essa é a alternância que entra em jogo, qualquer ajuda seria ótimo, obrigado.

Felicidades Josh

Respostas:

$(".show-menu").on("click", function () {

//check the state of the .menu-button, if it"s closed then run the open animation, if it"s open then run the close animation
if ($(".menu-button").html() == "close menu") {
$("#slideover").animate({
right: "0"
}, 300);
$(".menu-button").html("open menu");
} else {
$("#slideover").animate({
right: "512px"
}, 300);
$(".menu-button").html("close menu");
}
});

.on() é novo no jQuery 1.7 e substitui .bind() Nesse caso, se você estiver usando jQuery <1.7, use .bind().

Sobre o quê

$(".show-menu").on("click", function () {
if ($("#slideover").css("right") == "512px") {
$("#slideover").animate({
right: "0"
}, 300);
$(".menu-button").html("open menu");

} else {
$("#slideover").animate({
right: "512px"
}, 300);
$(".menu-button").html("close menu");
}
});