Показывать значки паузы/воспроизведения при наведении курсора мыши на видео или вводе курсора мыши ⇐ Jquery

[Anonymous]

Таким образом, этот код работает так, как и ожидалось. Hover/mouseenter/mouseleave правильно показывает и отображает значки паузы/воспроизведения.
У меня проблема в том, что при загрузке страницы значок паузы не отображается при наведении курсора/mouseenter? Это работает только после первого клика... Любая помощь приветствуется, спасибо.
// HTML






// END HTML

// jQuery
// Show video Play/Pause icons
$("#myVideo").mouseenter(function() {
$('.video-controls').show();
}).mouseleave(function() {
$('.video-controls').hide();
});

// Pause/Play video on hover
$("#myVideo").bind("click", function () {
var vid = $(this).get(0);
if (vid.paused) {
vid.play();
$('.video-controls').html('');
} else {
vid.pause();
$('.video-controls').html('');
}
});


Подробнее здесь: https://stackoverflow.com/questions/726 ... over-video