JavaScript links: Difference between revisions

The educational technology and digital learning wiki
Jump to navigation Jump to search
Line 37: Line 37:
* [http://www.dannyg.com/ref/jsminifaq.html JavaScript Mini-FAQ] by Danny Goodman (Goodman is author of JavaScript books)
* [http://www.dannyg.com/ref/jsminifaq.html JavaScript Mini-FAQ] by Danny Goodman (Goodman is author of JavaScript books)
* Danny Goodman's [http://www.dannyg.com/ref/jsquickref.html JavaScript and Browser Objects Quick Reference]
* Danny Goodman's [http://www.dannyg.com/ref/jsquickref.html JavaScript and Browser Objects Quick Reference]
* [http://www.devguru.com/technologies/javascript/home.asp DevGuru JavaScriptQuickRef] (events, functions, methods, objects, operators, properties, statements, and values)


== Tutorials and tutorial sites ==
== Tutorials and tutorial sites ==
Line 83: Line 84:
* [http://www.webforefront.com/archives/2005/05/ajax_demystifyi.html AJAX : Demystifying the buzz for all platforms.] @ Web Forefront Mai 2005. Short intro article
* [http://www.webforefront.com/archives/2005/05/ajax_demystifyi.html AJAX : Demystifying the buzz for all platforms.] @ Web Forefront Mai 2005. Short intro article
* [http://weblog.infoworld.com/article/05/10/17/42FEajaxcase_2.html Putting AJAX to work] InfoWorld article, (mostly a product overview)
* [http://weblog.infoworld.com/article/05/10/17/42FEajaxcase_2.html Putting AJAX to work] InfoWorld article, (mostly a product overview)
=== JavaScript language tutorials ===
(for those who want to become real programmers)
* [http://blog.morrisjohns.com/javascript_closures_for_dummies.html JavaScript Closures for Dummies], also available as [http://www.javascriptkit.com/javatutors/closures.shtml JavaScript Closures 101- they're not magic] by [http://blog.morrisjohns.com/ Morris Johns]. Such articles may help to understand why JS is an interesting language.
* [http://blog.morrisjohns.com/illumination_on_javascript_prototypes.html Illumination on JavaScript Prototypes], also by Morris Johns.


== Client-side modifications ==
== Client-side modifications ==
Line 127: Line 135:
* [http://www.hotscripts.com/JavaScript/ HotScripts.com/JavaScript] (Large Scripts collection)
* [http://www.hotscripts.com/JavaScript/ HotScripts.com/JavaScript] (Large Scripts collection)
* [http://www.webreference.com/tools/browser/javascript.html Java Script Browser Sniffer] at webreference.com. Updated 10/09/2006 (or better)
* [http://www.webreference.com/tools/browser/javascript.html Java Script Browser Sniffer] at webreference.com. Updated 10/09/2006 (or better)
* [http://www.javascriptkit.com/cutpastejava.shtml JavaScript Kit] Code to cut/paste. Some old.
* [http://www.javascriptkit.com/cutpastejava.shtml JavaScript Kit] Code to cut/paste (over 400). Some maybe old.
* [http://www.jsmadeeasy.com/ JavaScript Made Easy]. Some nice examples (but the page has JS errors when it loads ...)
* [http://www.jsmadeeasy.com/ JavaScript Made Easy]. Some nice examples (but the page has JS errors when it loads ...)
* [http://openjsan.org/ JavaScript Archive Network] (JSAN)
* [http://www.webreference.com/programming/javascript/ JavaScript tutorials at webreference] (also has a good list of site with code).
* [http://www.webreference.com/programming/javascript/ JavaScript tutorials at webreference] (also has a good list of site with code).
* [http://www.scriptsearch.com/JavaScript/ Scriptsearch]. Large collection of Scripts (also Tutorials, etc.)
* [http://www.scriptsearch.com/JavaScript/ Scriptsearch]. Large collection of Scripts (also Tutorials, etc.)
Line 190: Line 199:
** Rather easy to use (besides some strange difference between div id and an argument to pass): popup contents is inserted within a div that has an id like "Div1", "Div2" etc. An onload function then should call the hideDiv function in order to hide these div's contents. Ginally there is a createWindow function to call for displaying it. The fifth argument is (related?) to the id of the div.
** Rather easy to use (besides some strange difference between div id and an argument to pass): popup contents is inserted within a div that has an id like "Div1", "Div2" etc. An onload function then should call the hideDiv function in order to hide these div's contents. Ginally there is a createWindow function to call for displaying it. The fifth argument is (related?) to the id of the div.
  createWindow('My Window', 400, 'brown', 1, 0, 240, 375);
  createWindow('My Window', 400, 'brown', 1, 0, 240, 375);
* [http://www.sabadelli.it/edoardo/projects/javascript/widget.tooltip Widget.Tooltip.js].
** Creates small tooltips with code like this (additional options can be added):
new Widget.Tooltip({ elementId: 'myElementId', tooltipContent: 'my tooltip content' });


=== Menus ===
=== Menus ===

Revision as of 18:28, 10 April 2008

Definition

This is a short links page on JavaScript. Only sporadically maintainted !

Reference and Manuals

Introductions

JavaScript Reference

  • JavaScript at Mozilla developper center (JS 1.5 plus JS 1.6, 1.7, 1.8 upgrades].
  • Core JavaScript 1.5 Guide Can be used as Tutorial for the language only. Use a JS 1.2 or JS1.3 Guide for built-in non-standardized JavaScript objects, use the DOM specs for DOM objects.
  • JavaScript 1.5 Guide (Local copy of an old Netscape version)
  • ECMA-262 Specification (local copy, PDF). ECMA Script is a standardized Core Version (e.g. without any browser objects) based on the JavaScript 1.1 Specification. ECMA Script is the formal basis for many scripting languages (JavaScript 1.5, SVG and VRML scripting, Actionscript 3 etc.)

Document object model (DOM)

Else please consult the Document Object Model (alias DOM) entry.

JavaScript specific DOM Reference

  • History: For older NS 4.7 browsers and non-standardized so-called DOM 0 (e.g. HTML inline, browser interfaces) you may read: JavaScript 1.3 Guide and JavaScript 1.3 Reference Guide. These are outdated, but still on of the best references on how to use the old-style "standard" JavaScript Objects.

FAQs and Short References

Tutorials and tutorial sites

Warning: Some tutorials are not very clear about what's standardized, what's obsolete and what's informal but well supported.

Beginners tutorials

  • SELFHTML Tutorial by Stephan Münz (German and French)

General on-line tutorials

old-style JavaScript

(but useful)

JavaScript, DOM and DHTML tutorials

Ajax and DHTML tutorials

JavaScript language tutorials

(for those who want to become real programmers)

Client-side modifications

There are browser extensions that allow a user to change behavior of web pages. The best know is Greasemonkey.

Collections and links sites

General indexes

Ressource sites with tutorials and help

Sites with javascript code

(see also tutorials above !)

General developer libraries

See also AJAX

  • jQuery jQuery is a JavaScript library that takes this motto to heart: Writing JavaScript code should be fun... (12/2006).

Scripts and script collections

(this subcategory may need some sorting)

For programmers - both learning resource and code snippets or reusable code
Examples from books

Through the Web editor code

A list of Javascript HTML, XML, etc. WYSIWYG editors. By default, these are free. There may be better commercial but not listed solutions. Libraries listed here are all respectable, but (so far) we don't have any recommendation and features mentionned are not complete. See Comparison table and Standards schmandards 2007 for comparison.

Bigger
  • TinyMCE.
    • Is on of the more popular libraries and fairly easy to integrate and customize. Integrated in many popular CMS systems and cross-browser.
    • Used to have trouble with embedded lists (but this is maybe fixed now/ - DKS)
    • Wikipedia entry
  • FckEditor.
    • Crossplatform, XHTML 1.0, CSS, paste from Word, spell checker. Integration packs with various server-side languages.
    • Wikipedia Entry
  • Xinha, Crossplatform.
    • (DKS thinks it's the default one in the PostNuke CMS).
  • Loki.
    • Claims to be most standards compliant and encourages semantic markup.
  • WYMeditor is a web-based WYSIWYM (What You See Is What You Mean) XHTML editor).
    • Its main concept is to leave details of the document's visual layout, and to concentrate on its structure and meaning, while trying to give the user as much comfort as possible.
    • For certain applications where users ought to produce optional XHTML code, this is better than an WYSIWYG editor.
Smaller
  • HTMLBox. Cross-browser interactive open-source HTML textarea built on top of the jQuery library. Easy to use, best for smaller applications (users write smallers texts). 15KB only.
  • NicEdit. Even more lightweight than HTMLBox. Also can be used through widget code (JS is loaded from nicedit.com).

Popup and tooltip code

JavaScript/DHTML popups that are free and and work with modern browsers. While looking for 2-3 "products" I found several that didn't work properly - Daniel K. Schneider

  • Bride of Windows Popup, from Brainjar.com
    • It's actually a tutorial on how to write your on. But the code is enough mature to be used in production
    • A maybe outdated example I made is here.
  • openPopUps Popup code
    • Rather easy to use (besides some strange difference between div id and an argument to pass): popup contents is inserted within a div that has an id like "Div1", "Div2" etc. An onload function then should call the hideDiv function in order to hide these div's contents. Ginally there is a createWindow function to call for displaying it. The fifth argument is (related?) to the id of the div.
createWindow('My Window', 400, 'brown', 1, 0, 240, 375);
  • Widget.Tooltip.js.
    • Creates small tooltips with code like this (additional options can be added):
new Widget.Tooltip({ elementId: 'myElementId', tooltipContent: 'my tooltip content' });

Menus

  • Revenge of the Menu Bar A tutorial from brainjar.com. Includes good and reusable code for menus that are efficient and reliable.
    • Demo page (source included in the HTML page).
    • Menus are made with div's and classes for these divs.