問題與特定的jQuery動畫

這裏是我的代碼：問題與特定的jQuery動畫

$('.button').click(function() { 
     $(this).addClass('clicked'); 
     $('.button').not(this).removeClass('clicked') 
      .addClass('not_clicked'); 
     $('#tool_window,#wrapper').not('#work_area').not('.button').addClass('outside'); 
    }); 

     $('.outside').click(function() { 
      $('.clicked').removeClass('clicked'); 
      $('*').removeClass('not_clicked'); 

      $('#img_add').animate({ 
      top:'469px', 
      opacity:'0.0' 
      }); 
     }); 



    $('#image').click(function() { 
     $('#img_add').animate({ 
      top:'566px', 
      opacity:'1.0' 
     },200); 
    });

這是HTML：

<div id = 'img_add'> 
      <form> 
       <input id = 'img_loc' type = 'text' /><br /><br /> 
       <input id = 'add_btn' type = 'button' value = 'Add_Image!' /> 
      </form> 
     </div> 
     <div id = 'tool_window'> 
      <div id = 'image' class = 'button'> 
      Add Image 
      </div> 
     </div>

我想img_add div來顯示當我點擊image格，但我希望它當我點擊（或另一個按鈕）時消失。我試圖通過在單擊按鈕時向外部元素添加一個outside類，並向連接到outside類的點擊處理程序添加淡入淡出動畫來實現此目的。但是淡出的動畫不會發生。任何想法，爲什麼這不工作？

來源

2011-12-12 dopatraman

var hoverOverImgAdd=false; 
$('#img_add').hover(function(){ 
hoverOverImgAdd=true; 
}, function(){ 
hoverOverImgAdd=false; 
}); 

$('body').mouseUp(function(){ 
if(!hoverOverImgAdd){ 
    // hide using animation here; 
} 
});

來源

2011-12-12 15:08:45 Nakul

@ Nakul - 你介意說明你在這裏做了什麼嗎？什麼是'hoverOverImgAdd'？你有沒有在別的地方定義它？布爾人如何觸發動畫？ – dopatraman

對不起。 hoverOverImgAdd是第1行定義的變量。我們存儲鼠標是否在img_add之上，或者不在這個變量中。現在，當有人點擊頁面上的任何地方時，我們檢查它是否通過img_add使用此變量。 – Nakul

我不知道爲什麼它不工作，由於某種原因，我甚至無法得到它在撥弄工作，但看到這裏我建議嘗試.blur()：http://api.jquery.com/blur/這可能會解決你的問題。我會和它一起玩，看看我能否得到一個可行的解決方案。

來源

2011-12-12 15:09:09

問題與特定的jQuery動畫

回答

相關問題