The issue I'm encountering is just as described in the title. The code functions correctly on all divs except for one!
$(".complete-wrapper-1").hide();
var panelHH = $(".file-select-wrapper").innerHeight;
$(".files-button").hover(function(){
$(".complete-wrapper-1").show();
});
$(".complete-wrapper-1").hover(function(){
$(".file-select-wrapper").stop(1).show().height(0).animate({height: panelHH},500);
}, function(){
$(".file-select-wrapper").stop(1).animate({height: 0},500, function(){
$(this).hide();
});
});
Edit: html.
<!DOCTYPE html>
<html>
<head>
// CSS and script references
...
</head>
<body oncontextmenu="return false;">
<div id = "frameAsWhole">
<div class ="item-frame">
<div class = "box1">
<div class = "infoPane">
</div>
<div class = "area-frame">
<div class = "desktop-box">
// Other HTML elements
</div>
</div>
<div class = "taskbar-wrap">
<div class = "taskbar">
<div class = "files-button">
// Content inside files-button
</div>
<table>
<tr class = "taskbar-items">
// Taskbar items
</tr>
</table>
<div class = "search-wrapper">
<input type="textarea" class ="search-bar">
</input>
<div class = "computer-search">
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>