I'm in the midst of a project that involves using the electron framework. Within my project, I have an HTML file, a CSS file, and a Javascript file. The issue at hand is that when I hover over a button, the expected hand pointer icon fails to appear despite setting up the appropriate attribute in my CSS code.
Let's start with my HTML code:
<button style="background: url(images/cross.svg);" alt="exit" id="exit_button"></button>
Next, here's the corresponding CSS code:
#exit_button{
cursor: pointer;
width: 15px;
border: 0px;
height: 15px;
margin: 0%;
padding: 0%;
position: absolute;
top: 5px;
right: 5px;
}
And finally, let me share my Javascript code:
//variables
const remote = require('electron').remote;
const exit_button = document.getElementById("exit_button");
//Firing functions
exit_button.addEventListener('click', close_window);
//functions
function close_window() {
console.log("exit_button clicked, window closing..."); //This DOESN'T print
var current_window = remote.getCurrentWindow();
current_window.close();
};
To compound matters, the click event tied to exit_button doesn't seem to be functioning properly either, exacerbating the pointer issue described earlier.
Your help and insights are greatly appreciated.