I am currently developing a website for our family business and encountering some challenges with implementing a dropdown menu. Specifically, I am attempting to link the 'plant list' item to the 'plant list intro' page and then have it display additional pages upon hovering.
Previously, I had success using an extension for this functionality. However, modifying the template within the extension ends up disrupting the overall design of my webpage.
Below is a snippet of the code from one of the pages I am working on:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hocklynn Index</title>
<meta name="author" content="Ralph Phillips">
<script src="../css/stylesheet.js" type="text/javascript"></script>
<style type="text/css">
@import url("../css/stylesheet.css");
</style>
</head>
<body>
<!-- Code omitted for brevity -->
</body>
</html>
Additionally, here is the CSS code being used:
/*
CSS code removed for brevity.
For full CSS styling information, please refer to the provided fiddle below.
*/
A sample JSFiddle showcasing my code can be found here.