I hover on top of the div with the id="navbar" and it just won't seem to do anything.
i have added this to my head
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
code:
ShowNavbar = function(){
// show
}
HideNavbar = function(){
// hide
}
var config = {
sensitivity: 1, // number = sensitivity threshold (must be 1 or higher)
interval: 200, // number = milliseconds for onMouseOver polling interval
over: ShowNavbar(), // function = onMouseOver callback (REQUIRED)
timeout: 1500, // number = milliseconds delay before onMouseOut
out: HideNavbar() // function = onMouseOut callback (REQUIRED)
};
$("html #navbar").hoverIntent( config );
my old code that worked
var timeout
const doc = document;
const navbar = doc.getElementById("navbar");
navbar.onmouseover = function(){
navbar.style.top = '0';
window.clearTimeout(timeout);
timeout = setTimeout(function() {
HideNavbar()
}, 1500);
};
Im not familiar with hoverIntent, so this is a general observation.
For over and out you are not passing a reference to a function, but rather the result of the functions as you are calling the function in your object
Try this instead.
var config = {
sensitivity: 1, // number = sensitivity threshold (must be 1 or higher)
interval: 200, // number = milliseconds for onMouseOver polling interval
over: ShowNavbar, // function = onMouseOver callback (REQUIRED)
timeout: 1500, // number = milliseconds delay before onMouseOut
out: HideNavbar // function = onMouseOut callback (REQUIRED)
};