0

ページ上部のバナーに、画面上にいくつかのyui2オーバーレイを起動するボタンがあります。各オーバーレイには閉じるボタンがあります(これにより、表示が非表示に変更され、再利用できるようになります)。オーバーレイが起動された後、表示されるバナーにボタンがあり、クリックするとすべてのオーバーレイが閉じます。

これにより、すべてを閉じるか、それぞれを個別に閉じるかを選択できます。これは私が立ち往生しているものです:

ユーザーが個々のオーバーレイを閉じた場合、オーバーレイを閉じた後、他のオーバーレイがまだ開いているかどうかを確認したいと思います。それらがすべて個別に閉じられた場合は、上部のバナーを元に戻して、[すべて閉じる]ボタンを削除する必要があります。

次の手順ですべてのオーバーレイを検索できます。

var elements = YAHOO.util.Dom.getElementsByClassName('test');

オーバーレイを閉じるたびにその配列を調べて、すべてが非表示になっている場合に可視性に設定されていることを確認するために必要なロジックを考えることはできません。その場合は、関数を実行します。それでもページにオーバーレイが表示されている場合は、何もしません。

これが私が思いついた答えです。それが正しいかどうかはわかりません。

 var elements = document.getElementsByClassName('test');
 var visiblecounter = 0;
 for (var i = 0; i < elements.length; i++) {
    if(elements[i].style.visibility!='hidden'){
      alert("not hidden");  
      visiblecounter ++;    
     }     
  }
     ​
if(visiblecounter > 0){
    alert("all overlays are closed individually. you can remove close all button");
} 
4

2 に答える 2

0

質問があるかどうかはわかりませんが、できる限りサポートさせていただきます。これが私がすることです。また、アクティブクラスを定義するので、HTML要素は次のように記述されます。

<div class="john active"></div>

そして私のcssで私は書くでしょう。

.john {display: none};
.active {display: block};

したがって、デフォルトではオブジェクトは非表示になっています。ただし、「アクティブ」クラスを追加すると、画面に表示されます。これで、次のウィザードを実行できます。

$(".hideButton").click(function() {
    $(this).removeClass("active");
});

他のすべてのオブジェクトを非表示にしたい場合、それらがDOMで同じ親を持っていると仮定します

$(".hideOthersButton").click(function() {
    $(this).siblings().removeClass("active");
});

同じ親を共有するすべてのオブジェクトを非表示にする場合。

$(".hideEverything").click(function() {
    $(".parent").children().removeClass("active");
});

これがお役に立てば幸いです。さらにサポートが必要な場合はお知らせください。このソリューションはJqueryを使用していますが、ロジックを他の目的に転用することができます。

于 2012-10-24T01:19:08.827 に答える
0

あなたはそれらのオーバーレイを再利用していると言っているので、再利用のためにオーバーレイをプールしているので、配列などにオーバーレイがあると思います。DOM(常に高価です)をチェックしてそれらが表示されているかどうかを確認する代わりに、次のように、表示属性をチェックするオーバーレイの配列をループします。

   var anyVisible = false;
   for (i = 0; i < myOverlays.length; i+=1) {
        anyVisible |= myOverlays[i].cfg.getProperty("visible");
   }

それらのいずれかが表示されている場合は、ボタンを無効にします。

于 2012-10-24T14:22:44.363 に答える