The most commonly used form of scripting in ThinkQuest is the JavaScript. All you have to do is to put this line into the HTML document (preferably in the head section after the link tags):
<script type="text/javascript" src="something.js"></script>
Replace the "something.js" with the path of your script on the directory.
Let us run through several ways that the JavaScript can do on our site.
A ThinkQuest example will be the
The Third Reich (1933-1945) site.
Every time a visitor enters the site or refreshes the page while navigating, the content in the random fact area changes. The purpose of this interactivity is to allow visitors to learn something new during each visit. The information is displayed in 'small, digestible chunks', making it easier for visitors to commit it to memory. Also, it makes the visitor want to come back to the site often.
Here is an example script achieved by DOM scripting, courtesy of Qing Sheng from our team:
View on new page
To use it, you will have to replace the quotes with your topic-related quotes, and have a div with id named "factbox"(properly styled by a stylesheet) in the HTML document. Of course, it will be good to have someone with JavaScripting knowledge to customize it for the site. If you need help on HTML, visit out HTML section.
Many sites test their readers' knowledge with quizzes. A ThinkQuest example will be the
Cybercrime site. Why not have one on your website? It will help the reader gauge his/her knowledge of your topic effectively.
Here is an example script that checks the marks of the user:
View on new page
This script must be coupled with a proper HTML document like the site content quiz page. All you have to do is to set the correct answers in the script, change the number of questions in the loop of the "Score()" function and the comments matching each score. Next, change the questions and answers in the HTML document and you are done.
This is almost a must-have for all websites. An example of a ThinkQuest entry having a search engine is the
e-Divide: Information Inequality site. Some visitors will want a direct way of getting to the information they want by entering search keywords. It will not be good to let the visitor navigate a massive complex site just to search for say the definition of a keyword. Hence, the search engine is very useful in providing direct access.
Our team member, Qing Sheng has converted a search script downloaded from the WWW to use DOM scripting. You can view it here. Please note that this script is specially designed for sites using AJAX (see more information below).
To use it, you will have to create a HTML document named "results.html", and include one h2 tag with id "pagefound" and another p tag with id "result". Once this is ready, customize the sites to show in the script. In your main page, the search form should load the results page on submit, and the results page should call "search_form()", "num_jse" and "out_jse()" on load.
It is often necessary to assess a user's browser capabilities to ensure that the client machine can experience the enhanced features of the site. A ThinkQuest example will be the
AI: Manufactured Minds entry.
Sometimes, you might need to know what browser the user is using so that you can customize certain things in your site for the user. An example of a script which needs this is the AJAX script since different browsers might be using different functions and methods.
Here is some sample code to illustrate it:
if (window.XMLHttpRequest) // if Mozilla, Safari etc
page_request = new XMLHttpRequest()
else if (window.ActiveXObject){ // if IE
Also, another important script that your site should have is to check whether the site supports JavaScript itself. You can use DOM scripting to achieve this purpose. The basic idea is to have an element that originally displays a "Turned Off" message on the page, then use DOM scripting to access this element and change it to "Turned On" if JavaScripting is turned on, otherwise the message remains the same.
The above ThinkQuest entry example has a basic routine for this. If you are interested, visit it here. It would be best for you to have some JavaScript knowledge for this.
A ThinkQuest example:
2005Aug Entry 00623
The reason why sites can remember your preferences is due to the use of cookies. Cookies store data of the user's machine settings so that on the next visit, it is able to load up the same settings. This makes the site appear user-friendly in adapting to users' preferences.
It is not difficult to use cookies. Take a look at the Cookies script used on our site. You just have to focus on the first 3 functions - getCookie, setCookie and deleteCookie. For those faint at heart, there is no need to know how it works. All you need to know is how to use it!
To set a cookie, just call the setCookie("title", value, no.of.days) function, passing in the desired values to remember. Any other function that needs to recall the value set will just have to call the getCookie("title") function and assign it to a variable, and then carry on with the rest of the module.
One can use JavaScript to devise many interactive activities, and it is up to the developers to make good use of them. It can even be used for games such as the popular "Hangman", and the recently most talked about AJAX-enabled capabilities.
To allow you more freedom and room for creativity, we recommend some good open source scripting resources:
Dynamic Drive
Hot Scripts
Do note that there are licensing terms attached to scripts even though they are free. Remember to acknowledge the scripter both in the JavaScript file and in the acknowledgments section of your site.
It is useful to note W3C also has some guidelines on the use of JavaScript. The "document.write" and "innerHTML" should be avoided as much as possible, and replaced with DOM scripting in order to achieve graceful degradation and progressive enhancement. This allows for the website to function well for a wide range of devices.