ASP/DHTML Crossword Project

This is a little project of mine, which started in March 2002 as an exercise in Javascript and CSS, and has evolved into something rather more advanced. With an ASP back-end, this is now a very customisable crossword puzzle generator, and I'm always adding new features. Ultimately, this is still very much a prototype, and feedback, comments or suggestions are always appreciated.


1. Friend's boat partially goes down deep (10)
6. Crap case of slowish vehicles (4-4)
7. Made after hearing problems (4)
8. Writer of note in shit (5)
10. Mad about toilet (5)
12. Problem with cattle (4)
14. Something for able scot to overcome (8)
16. Flat rock music? (5-5)


1. Name of redcar man? (4)
2. Little horse's head? (4)
3. Damage crew of 1000 (5)
4. Say 'hello' to posh yacht (3)
5. Overtook a lasagne (5)
6. Seperate bit (4)
9. Liberate Reef (4)
10. Puts a lot into plans (5)
11. Very eastern riser (5)
12. Sad Colour (4)
13. Wife elicits touch (4)
15. View ocean, we hear (3)

Technical Stuff

Everything relating specifically to a crossword is contained within a top-level server-side include file, in this case: This is entirely self-contained code, could be dropped into any page, and consists of:

Client-Side: The DHTML rendered by the engine script is based on applying CSS properties to <div> elements, and <input type="text"> form elements. Everything with the grid is absolutely positioned via an array of rows, each of which contain an array of x-by-y squares. Every square div is assigned a type - type 0 is a 'dead' square, regular squares are type 1, and type 2 represent squares at the beginning of a clue. If you look at the arrays in the data file, you'll see that the [0]s, [1]s and [2]s correlate exactly to the layout of the grid as it appears on screen.

One little feature is the option to specify a crossword image, which will appear instead of the DHTML on older browsers, and which will also be rendered when printed, via a media descriptor in the CSS.

Server-Side: It's very simple ASP/VBScript and can all be found in the ASP include file as detailed above. Basically the form submission returns a string of characters from the grid, and if they match the characters of the correct answer (i.e. the correct letter in every input box) then you have got it right. There is also a 'generate' mode, which can be accessed by adding '?mode=generate' to the url, whereby the crossword creator fills in the correct answers, and then submits, and it will generate the string, which to be matched when people try to solve the puzzle.

Known Issues as at 20/3/2002:

Possible Future Additions: