JQuery：イメージマップ上で別の領域をクリックするとトグルボックスが閉じますか？

Question

駅をクリックすると地図の右側に情報ボックスが表示されるロンドン地下鉄の地図があります。パネルを閉じるためにもう一度そのステーションをクリックする必要はなく、別のステーションがクリックされたときに新しいボックスを閉じて開くことができる方法はありますか？

この例ではKings CrossとBaker Streetが使用されています。

Answer 1

あなたのフィドルでは、ID「BS」を対応するエリアに追加する必要があります。そうでない場合は、Kings Crossだけが動作します。

JavaScriptをすべてこれに置き換えると、好きなことができます。

$(document).ready(function(){ 
    $("#Map area").click(function(){ 
     $('.boxes').hide(); 
     $('#' + this.id + 'D').animate({ 
      width: "toggle" 
     }); 
    }); 
}); 

ボックスをアニメートする必要がある場合は、jQueryアニメーションコールバックのドキュメントを参照してください。

http://api.jquery.com/animate/