Bringing text elements to foreground to make clickable


(Ian) #1

I am trying to hyperlink from objects and text using scripting ( window.location.href ) which works fine in itself. Each object has its own links which work OK, but there is a problem when I reveal and hide different text elements all in the same screen space. I want a number of messages to appear in the centre of the screen, each of which should also be clickable. At present only the ‘top’ text is clickable and it seems to still be ‘in the way’ even when visibility is 0 (I have inhibited clicking on each layer when in this state). I have tried setting z-index to bring layers forward, but may be calling this incorrectly as it does not seem to be working.

If anyone has a moment to take a look at this and advise I would be grateful. link text tst.hype.zip (21.4 KB)


(Ian) #2

You know how it is - you write something down and then find a solution! I think I have got there with the following syntax for z-index:
hypeDocument.getElementById('elementId').parentNode.style.zIndex = 9999;

An updated demo: link text tstv2.hype.zip (21.5 KB)


#3

look at the getter and setter functions in the API :wink:

hypeDocument.getElementProperty(element, propertyName);
hypeDocument.setElementProperty(element, propertyName, value, optionalDuration, optionalTimingFunctionName);

using the above you can set and get the z-index property.

example:

hypeDocument.getElementProperty(element, "z-index");
hypeDocument.setElementProperty(element, "z-index", 9999, 1.0, "easeinout");

Note using element here with a mouse click action will enable you to change the z-index on whatever element you click. You can put in an id of an element instead if you wish.