index.html

<!--Linear Search Visualization HTML File 
    author(Joshua Thomas)
    date(07.01.2022)
    version: 1.0
-->

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="style.css">

    <title>Linear Search Visualization</title>
</head>
<body>
    <h1 style="text-align:center; font-size:50px">Linear Search Algorithm Visualization</h1>
    <p style="text-align:center; font-size:18px; margin:50px">This program searches through an array of items 1 - 5 (index 0 - 4) looking for the item the user wishes to find.<br>If found the item will turn color, if not the user will get an alert saying that the item chosen wasn't found.</p>
    <div class="container">
        <div clsss="container2">
            <div class="1" id="box1">
            </div>
            <div class="2" id="box2">
            </div>
            <div class="3" id="box3">
            </div>
            <div class="4" id="box4">
            </div>
            <div class="5" id="box5">
            </div>
        </div>
    </div>
    
    <button id="start">Start</button>
    <button id="clear">Clear</button>
    
    <script type="text/javascript" src="script.js"></script>
</body>
</html>

<!---@copyright Joshua Thomas--->