Loading Profile...
Seadragon Ajax Overlays & HREF
Hello, I'm having trouble with overlays! I've added the following functions (based off of the example given on the seadragon site) and they display fine, but I cannot actually click on the link which appears - it is only accessible by right click open link in.... Clicking just zooms in on the image (normal navigation).
Is there another way for adding a link on top of an overlay (other than innerHTML - isn't compatible with IE anyway!) which I will be able to click on? I know it must be possible to create links using Seadragon Ajax as it is shown here: http://www.wdl.org/en/
function init() {
viewer = new Seadragon.Viewer("container");
viewer.addEventListener("open", addOverlays);
viewer.openDzi("GeneratedImages/dzc_output.xml");
}
function addOverlays(viewer) {
var harry = document.createElement("div");
var pointharry = new Seadragon.Point(
0.6479860647626986, 0.21632549161594064);
var placementharry = Seadragon.OverlayPlacement.BOTTOM;
harry.className = "overlay";
harry.innerHTML = "Microsoft";
viewer.drawer.addOverlay(harry, pointharry, placementharry);
Many thanks in advance!
Is there another way for adding a link on top of an overlay (other than innerHTML - isn't compatible with IE anyway!) which I will be able to click on? I know it must be possible to create links using Seadragon Ajax as it is shown here: http://www.wdl.org/en/
function init() {
viewer = new Seadragon.Viewer("container");
viewer.addEventListener("open", addOverlays);
viewer.openDzi("GeneratedImages/dzc_output.xml");
}
function addOverlays(viewer) {
var harry = document.createElement("div");
var pointharry = new Seadragon.Point(
0.6479860647626986, 0.21632549161594064);
var placementharry = Seadragon.OverlayPlacement.BOTTOM;
harry.className = "overlay";
harry.innerHTML = "Microsoft";
viewer.drawer.addOverlay(harry, pointharry, placementharry);
Many thanks in advance!
I’m confused
3
people have this question
I have this question, too!
Tell me when someone answers.
The more people who ask this question, the more it gets noticed.
The more people who ask this question, the more it gets noticed.
The company marked this question as answered.
-
Inappropriate?Michael,
I'm sorry that it's taken me so long to reply. I hope this is still relevant and timely for you.
The link doesn't work because the default action of clicking on the <a> element (navigating to the link) is canceled by the Seadragon.MouseTracker instance for the Seadragon canvas. This is the default behavior of MouseTracker whenever a clickHandler is registered. In this case, a clickHandler is registered on the canvas to zoom in when the user clicks.
Off the top of my head, I can't remember why that behavior (canceling the default click action if a click handler is registered) was necessary. But I do remember a simple workaround: to stop the event from propagating up to the MouseTracker's element. We do this in our about screen with two lines of code; here they are, adapted to your overlay:
// make sure that clicking the link works; prevent the MouseTracker
// from canceling the click event by stopping the event's propagation
// up to the canvas element that the MouseTracker is listening to.
// we're also stopping "mouseup" events due to a bug in MouseTracker.
Seadragon.Utils.addEvent(harry, "mouseup", Seadragon.Utils.stopEvent);
Seadragon.Utils.addEvent(harry, "click", Seadragon.Utils.stopEvent);
Sorry that this caused you trouble, but hope this helps!
The company says
this answers the question
-
Inappropriate?I get a message that this isn't supported on the browser and to use IE 7 or Firefox 3. I used both and get same message.
This happens whenever I attempt to use the addEvent as above
-
Inappropriate?Actually found out the problem, i was attaching to the rect and not the actual htmlelement
EMPLOYEE
