Jquery：在悬停时显示/隐藏div.点击显示

我希望当用户使用.image类悬停在另一个div上时显示div.description.

但是,当用户点击div.image时,我希望div.description保持可见.因此,如果用户单击.image,则不应应用mouseleave事件.

最后,当用户再次点击.image时,应再次激活悬停功能.这样当鼠标离开.image1时,div.description将再次被隐藏.

希望你们能帮助我！

var cancel = false;
$(".another").hover(function(){
    $("div.description").show();
},function(){
  if(!cancel)
  $("div.description").hide();
});

$(".image").click(function(){
  cancel = (cancel)?false: true;
});