3

私はほとんどの Web 開発に慣れていないので、サポートをお願いしています。別の div で異なるコンテンツをトリガーするいくつかの領域を割り当てたイメージ マップがあります。onmouseover トリガーに遅延を追加して、ユーザーがカーソルを誤ってその上に置くのではなく、領域にカーソルを置いた場合にのみ div のコンテンツが更新されるようにします。

これは、div コンテンツを切り替えるために使用する js です。

function showHideDivs(indx){
hideDivs();
oShowHideDivs[indx].style.display = 'block';
}

function hideDivs(){
for(i=0; i < oShowHideDivs.length; i++){
    oShowHideDivs[i].style.display = 'none';
}
}

window.onload=function(){
oShowHideDivs = document.getElementById('container').getElementsByTagName('div');
var oMap = document.getElementById('myMap');
for(i=0; i < oMap.areas.length; i++){
    oMap.areas[i].indx = i;
    oMap.areas[i].onmouseover=function(){
        showHideDivs(this.indx);
    }
  }
}

では、遅延を実装するにはどうすればよいですか? 事前にt​​hx！ヤン

編集:私は今このアプローチを使用しました:

oMap.areas[i].onmouseover=function(){
var area=this;
var delay=setTimeout(function(){showHideDivs(area.indx);},100);
area.onmouseout=function(){clearTimeout(delay);};
}

私には最も簡単に思えました。ヒントthx！

4

2 に答える 2

0

showHideDivs()特定の遅延の後に関数を呼び出すには、 setTimeout() を使用する必要があります。また、遅延が終了する前にユーザーがマウスを動かした場合、この関数の呼び出しを停止します。

具体的な例については、こちらをご覧ください: https://stackoverflow.com/a/6231142/1606729

于 2012-12-02T19:33:49.220 に答える