1

私はバックグラウンドプレーヤーをやっています。ユーザーが#playボタンをクリックすると、メインメニューがフェードインし0.1て表示が妨げられないようにします。ただし、メインメニューの上にマウスを置いて不透明度に戻すことにより、いつでもメインメニューを使用できます1。彼がマウスを外すと、再び透明になります。

ユーザーが#pauseボタンを押すと、メインメニューの不透明度が不透明に戻ります。ただし、メインメニューからマウスオーバーを削除した場合、不透明度は1のままである必要があります。

基本的に私はこれを持っています：

$("#play").click(function() {
    $("#menu").fadeTo('slow', 0.1);
    $(this).hide();
    $('#pause').show();
});

$("#pause").click(function() {
    $("#menu").fadeTo('slow', 1);
    $(this).hide();
    $('#play').show();
});

$("#menu").mouseenter(function() {
    $("#menu").fadeTo('slow', 1);
}).mouseleave(function(){
    $("#menu").fadeTo( // I want this back to the initial value, which can be 0.1 or 1 );
});

あなたはそれがここで働いているのを見ることができます：http： //luisgustavoventura.com

提案してください。

4

2 に答える 2

1

デモjsBin

あなたはこのようなことをすることができます：

var paused = true;

$("#play").click(function() {
  paused = false;
  $("#menu").fadeTo('slow', 0.1);
  $(this).hide();
  $('#pause').show();
});

$("#pause").click(function() {
  paused = true;
  $("#menu").fadeTo('slow', 1);
  $(this).hide();
  $('#play').show();
});

$("#menu").mouseenter(function() {
  if (paused){return;}
  $("#menu").fadeTo('slow', 1);
  }).mouseleave(function(){
  if (paused){return;}
  $("#menu").fadeTo('slow', 0.1);
});
于 2012-01-04T07:13:33.317 に答える
1

これはどうですか。メニューの最終値を変数に書き込んでから、それを使用してメニューをフェードインします。

var menuopacity = 1;
$("#play").click(function() {
    menuopacity = 0.1;
    $("#menu").fadeTo('slow', menuopacity);
    $(this).hide();
    $('#pause').show();
});

$("#pause").click(function() {
    menuopacity = 1;
    $("#menu").fadeTo('slow', menuopacity);
    $(this).hide();
    $('#play').show();
});

$("#menu").mouseenter(function() {
    $("#menu").fadeTo('slow', 1);
}).mouseleave(function(){
    $("#menu").fadeTo('slow', menuopacity);
});

コメントに関する更新：メニューの実際の値を使用する別の解決策がありますが、ユーザーがメニューをフェードアウトしているときにメニューに再度入ると、ランタイムエラーが発生する可能性があります。

$("#play").click(function() {
    $("#menu").fadeTo('slow', 0.1);
    $(this).hide();
    $('#pause').show();
});

$("#pause").click(function() {
    $("#menu").fadeTo('slow', 1);
    $(this).hide();
    $('#play').show();
});

var menuopacity = 1;
$("#menu").hover(function() {
    menuopacity = $("#menu").css('opacity');
    $("#menu").fadeTo('slow', 1);
}, function(){
    $("#menu").fadeTo('slow', menuopacity);
});
于 2012-01-04T07:28:33.973 に答える