Revision of Twine macro: << mouseoverlink >> from Tue, 02/12/2013 - 08:52

This simple macro produces a usable internal link whose text changes whenever you mouseover it.

version.extensions["mouseoverlinkMacro"]={major:1,minor:0,revision:0};macros["mouseoverlink"]={handler:function(a,b,c){var l=Wikifier.createInternalLink(a,c[0]);l.classList.add("mouseoverLink");insertElement(l,"span",null,null,c[1]);d=insertElement(l,"span",null,null,c[2]);d.style.display="none";l.onmouseover=function(){if(this.childNodes.length>1){this.childNodes[0].style.display="none";this.childNodes[1].style.display="inline";}};l.onmouseout=function(){if(this.childNodes.length>1){this.childNodes[1].style.display="none";
this.childNodes[0].style.display="inline";}};}};


This uses the << choice >> macro's parameter order - the destination passage name comes first. Then comes the visible label, then the hidden label.

Usage example: <<mouseoverlink "CryPassage" "Stand and fight, guns blazing" "Sit down and have a cry">>

For obvious reasons, this won't work on iPads!

Implementation details:

* The link has a class of "mouseoverLink" in addition to the standard internalLink/brokenLink classes.
* Each text label is a <span> inside the <a>, and the mouseover and mouseout events make one or the other visible.