I wouldn't try and update the native browser tooltip if I were you, I would try something more custom like this:
<html>
<head>
</head>
<style>
#last-update-title{
position: relative;
margin-top: 20px;
}
#tooltip{
position: absolute;
top: -20px;
display:none;
}
#tooltip.show{
display:inherit;
}
</style>
<body>
<div id="last-update-title" onmouseover="showToolTip('show');" onmouseout="showToolTip('');">
Some Text here
<div id="tooltip"></div>
</div>
</body>
<script type="text/javascript">
function showToolTip(show){
document.getElementById('tooltip').className = show;
}
var startDate = new Date();
setInterval(function(){
document.getElementById('tooltip').innerHTML = customFormatTimeSecondsAgo(startDate);
}, 1000)
function customFormatTimeSecondsAgo(date) {
var result = Math.floor((new Date() - date) / 1000);
if (result <= 1) return "Updated: Just now";
return "Updated: " + result + " seconds ago";
};
</script>
</html>
This avoids problems around how different browsers render tooltips, and also will get around the tooltip not updating dynamically as you want it to.