MediaWiki:Common.js

From Species-ID
Revision as of 12:23, 16 December 2008 by Gregor Hagedorn (Talk | contribs) (New code for target highlighting of internal links, especially for single-access keys)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

Note: After saving, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Clear the cache in Tools → Preferences
// <source lang="javascript">
/* Any JavaScript here will be loaded for all users on every page load. */

/***
 *** Highlight all targets of page-internal links. The code works generically, 
 *** but has special options for single-access identification keys.
 *** by Gregor Hagedorn, Nov. 2008
 ***/
function highlight_target(caller) {
/* Highlight a single element that is the target of the caller (which must always be a link object, e.g. <a href=...>)
   USAGE: highlight_target(this) */ 
/* LATER: perhaps try elem.scrollIntoView() instead of the normal hyperlink action */
/* style.fontSize="120%" moves lines up/down..., style.color="#FFCC50" (= nice orange) is too strong. */
/* I HAVE NO CLUE WHY BORDER DOES NOT WORK: target.style.border = "2px dashed red"; */
var idref = caller.hash.substring(1, caller.hash.length); /* substring strips leading hash */
highlight_targetx( idref,       "",        "",               "blink underline");
highlight_targetx( idref+"row", "#FFEEA0", "2px dashed red", "none");
}

function highlight_targetx(idref, backgroundColor, border, txtdeco) {
 /* subfunction of highlight_target, for a single target element */ 
 var target = document.getElementById(idref);
 var reset_string = "highlight_reset(\""+idref+"\",\""+target.style.backgroundColor+"\",\""+target.style.border+"\",\""+target.style.textDecoration+"\")";
 target.style.backgroundColor = backgroundColor;
 target.style.border          = border;
 target.style.textDecoration  = txtdeco;
 window.setTimeout(reset_string, 2000);
}

function highlight_reset(idref, old_bcolor, old_border, old_txtdeco) {
/* Stop highlighting (blinking and background color) */ 
if (idref != "") { /* remove previous highlight: */
 var e = document.getElementById(idref);
 e.style.backgroundColor = old_bcolor;
 e.style.border          = old_border; /* reset value may be "" for no border! */
 if (old_txtdeco == "") old_txtdeco = "none";
 e.style.textDecoration  = old_txtdeco;
 }
}

function add_target_highlighting() {
/* Add the necessary onclick events to all page-internal links. 
Registration is done through anonymous function calling highlight_target(); 
Note: "this" must be passed as parameter since valid only in the anonymous function, but not in  highlight_target()! */
 for (var i = 0, max = document.links.length; i < max; i++) {
  lnk = document.links[i];
  if (lnk.pathname==location.pathname && lnk.hash.length>0) { /* = is page internal link */
    document.links[i].onclick = function(){highlight_target(this)};
  }
 }
}

addOnloadHook(add_target_highlighting);

// </source>