I need help with my graduation project. I am making a website for an Aquapark and I focus mainly on the front-end and I want to implement a search box in my website.
I want that when the user writes keywords in the field, such as opening hours or price list, so that the page offers him a menu of options according to the keywords, and when he clicks on one of these, it will take him to the given HTML file, which is for that item in menu connected.
I have already created a searchbar in html with an input that has the id "searching_element". And I have it styled. I just need a function/functions that ensure that when the user types the given words into the field, it can throw them to another HTML page based on what they typed into the input. For example, I want that when the user enters "opening hours", it will take him to the url that I give him for this keyword.
I want to learn how these search-bars work and what method for searching will be the simplest but still functional.
I prefer to solve it based on Javascript, HTML and CSS only. But if it is necessary to use other technologies, I will use them with a little help.
Thank you all for any help <3
<i class="uil uil-search search-icon" id="searchIcon"></i>
<div class="search-box">
<i class="uil uil-search search-icon"></i>
<input id="searching_element" type="text" placeholder="Hledat..." />
</div>
I tried different codes from the internet, different youtube videos, different ideas of mine or even ChatGPT but I couldn't come up with anything with any of them. I'm not that advanced in this area.