jqueryUI labyrinth

Labyrinth is a jQuery plugin to create labyrinth games.

• denizli escort
• denizli escort
• didim escort
• düzce escort
• edirne escort
• edirne escort
• edremit escort

Source: github.com

1. INCLUDE CSS AND JS FILES

<!-- DEPENDENCIES (jQuery & jQuery-UI) --> 
<link href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css">
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>

<!-- LABYRINTH PLUGIN (script & style) -->
<link href="css/jquery.labyrinth.css" rel="stylesheet">
<script src="js/jquery.labyrinth.js"></script>

2. HTML

<div id="labyrinth1" class="labyrinth">
	<img class="labyrinth-image" id="lab1-mouse" src="example-images/mouse.jpg">
	<img class="labyrinth-image" id="lab1-cheese" src="example-images/cheese.jpg">
</div>

3. JAVASCRIPT

$(function(){
        // First labyrinth: one in-out pair. 
    	$("#labyrinth1").labyrinth({
		cellSize: 50, 
		rows: 10, 
		columns: 12, 
		borderWidth: 5,
		borderLineCap: "square", //square is default
		borderColor: "#406060",
		drawWidth: 2,
		drawColor: "#000000",

		// Cells are numbered from left to right
		//  and from top to bottom, row-wise. First is 0
		inOutPairs: [[48,83]], 

		// Padding (outside labyrinth): top, right, bottom, left.
		// Padding area is drawable too.
		padding: [2, 100, 2, 140],

		onComplete: function(n) {
			alert("Congratulations! The mouse got the cheese!");
			this.reset();
		}
    	});
});