About Oileide

Oileide is a small AJAX library, that includes automatic bookmarking via HTML markup.

For a description of the API see the github wiki for the project.

How to use Oileide in auto mode

  1. Include oileide.js in your HTML file in the head via
    <script src="oileide.js?auto"></script>
    and the css file oileide.css for some stuff (explained in #3 and #4).
  2. Links that should be ajaxified need an id that will show in the anchor after being clicked, and a rel attribute in the format of oileide[id_of_element_to_overwrite]. The document to link to is the usual href attribute, therefore graceful degradation is included.
  3. If you do not want to show some elements of the linked document (e.g. header, footer) in the AJAXified page, but want to keep these parts in the document for graceful degradation, then add class "olympic" to them.
  4. During the loading of the ajaxified content, the element that should receive the content will receive an overlay.
See the Demo without AJAX-content, and the same with clicked link_1 and link_3.


  • What does the name mean?
    According to the Illiad by Homer, there were two Greek heroes named Ajax in the Trojan War, Ajax the Greater and Ajax the Lesser. Ajax the Lesser was skilled with the spear and a fast runner, only second to Achilleus and beaten by Odysseus only because being tripped by Athena. He was the son of Oileus, therefore his cognomen was Oileide, i.e. son of Oileus. Some mythological references can be found in the source code: Invisible elements of ajaxified links have the class "olympic" because several Olympic Gods took part in battles in the Trojan War invisibly, and the overlay that gets replaced after the request is called Cassandra's veil because Ajax the Lesser raped Cassandra during the sack of Troy.


Oileide at GitHub
Clone URL