Back to Jibou's plugins

WordGrid - jQuery plugin

Introduction and Download

WordGrid is a jQuery plugin that allows you to easily install a wordgrid game on you website.

The aim of the game is for the player to find a word in the middle of a randomly generated grid of letters

Download wordgrid.js (version 0.1.0 - September 2012)

Here is a live demo of the plugin.

How to use

Install

  1. Download jQuery's library here.
  2. Download wordgrid.js
  3. Upload jQuery's library and wordgrid.js in a directory (let's call it "js")
  4. Add the following code between the tags of your HTML file : <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.wordgrid-0.1.0.js"></script>

Use

  1. The grid will generate inside a div so you need a specific div in your page. Add this code if you don't already have one : <div id="grid"></div>
  2. Then, anywhere on yourpage add the following javascript (jQuery) code : <script> $(document).ready(function(){ $('#grid').wordGrid(); } </script>

Options

Here is an exemple of use using the full list of available options.

<script> $(document).ready(function(){ $('#grid').wordGrid({ column: 10, // Number of column you want the grid to be row: 12, // Number of rows you want the grid to be word: 'WORDGRID', // Word you want the player to find showWord: false, // If set to true, this option will add a class "theword" to the td that contains the letter for you word function(){ // Function to call in case the player wins alert('you found the right word'); } }); } </script>

Demos

You can see live demos on this page.

Future versions

Future ideas for development are :