Random Maze Generator In jQuery
File Size: | 3.27 KB |
---|---|
Views Total: | 331 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

A jQuery-powered maze generator that helps generate maze puzzles with random background images.
How to use it:
1. Create a container element for the maze generator.
<div id="maze" class="shadow"> </div>
2. Load the maze.js
after jQuery library.
<script src="/path/to/cdn/jquery.min.js"></script> <script src="/path/to/maze.js"></script>
3. The necessary CSS styles for the maze generator.
body { background-image: linear-gradient(147deg, #000000 0%, #272727 74%); display: flex; justify-content: center; align-items: center; width: 100vw; height: 100vh; overflow: hidden; } #maze { position: fixed; } .shadow { box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 2px 2px rgba(0, 0, 0, 0.2), 0 4px 4px rgba(0, 0, 0, 0.15), 0 8px 8px rgba(0, 0, 0, 0.1), 0 16px 16px rgba(0, 0, 0, 0.05); } #loader { height: 10px; border-radius: 10px; background-color: #00000078; width: 600px; position: fixed; top: 93%; } .cell { position: absolute; background-color: transparent; border: 1px solid transparent; } .top { border-top: 1px solid black; } .bottom { border-bottom: 1px solid black; } .right { border-right: 1px solid black; } .left { border-left: 1px solid black; }
This awesome jQuery plugin is developed by vikvikvr. For more Advanced Usages, please check the demo page or visit the official website.