Действие не работает в активном состоянии и удерживайте div

Question

У меня <div> с действием. Он работает нормально при нажатии, но, если я нажму и удерживаю, перетащите его наружу от <div> и отпустите, не вызывая действия.

Как мне решить эту проблему? См. Код ниже.

function my_btnpressed(){
    console.log("Button pressed.!")
}

#my_btn{
  width:300px;
  height:120px;
  background-color:cyan;
  
}
#my_btn:active{
  background-color:green;
}

.btn{
  display: flex;
    justify-content: center;
    align-items: center;
}

<div id="my_btn" class="btn" onclick="my_btnpressed()"> Click Me! </div>

JS Пример скрипта