Focus unrefocusable IE11

by Jools Chadwick

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
<div id="outer" tabindex="1">
  <div id="inner">
    Inner top
    <br/><br/><br/><br/><br/><br/>
    Inner bottom
  </div>
</div>

CSS

#outer{
  position:absolute;
  overflow:auto;
  height:50px;
  width: 200px;
}
#inner{
  position:absolute;
  background: green;
}

#button{
  position: relative;
  top: 50px;
}

JavaScript

var inner = document.getElementById('inner')

var focus = function(){
	$(inner).focus();
}

$(document.body).on('mouseup', function(){

	if(event.target==inner)
  {
  	console.log('Are we focusable? '+($(inner).closest(':focusable').length?'YES':'NO'));
    focus();
  }
  
	
});

setInterval(function(){console.log(document.activeElement);},5000)


$('<input type="button" id="button" value="Fix">').click(function(){
	focus = function(){
  	$(inner).closest(':focusable').focus();
  }
}).appendTo(document.body);