Can someone explain the best practice on how to set the position of a text node
ontop of an image in tapestry script using dojo?
It cannot be this difficult. I have lost weeks on this.
T-4.1.6 uses dojo-0.4.3, (also interested when this will get bumped to 0.9 or
1.0)
No matter what I try in my script the position fails to set on both IE and
FIREFOX.
I rendered a gallery widget on a T-4.1.6 page, and ontop of each image I just
create a text node as a child and write some transparent text.
So it is rendering nicely.... images in a gallery with dom text nicely layed
out ontop (as a child)
In IE the child node places fine and I do not have to muck with position except
for the X position (still do nto know why though). SO the X position i snad on
IE.
In firefox it's worse, both X,Y position are not being applied to the style and
layout deeper relative (x,y) into the page.
I tried to set manually. But that fails too...
My desired layout is coordinates (5,5) relative to the image position
------------ image node ------------
| |
| "here is my text node" |
| |
| |
| |
| |
-------------------------------------
I cannot set the position at all though. The coordinates coming back are 202
for Y but when all is said and done, the text position for Y gets placed at 0
somewhere way above the image node on the page.
Am I confused about dojo.html.getAbsolutePosition(...) ? It returns what seems
to be valid values but I am unable to get the text node to position at all. It
is like the rendering phase it taking over and clobbering anything I try to set.
Is it the rendering phase thats messing me up?
Here is a snippet. I am operating this out of a *.script file in T-4.1.6
Thanks for your help.
TransparentTextImage.script (module)function decorateTransparentText_${index}()
{debugger;// now attach transparent text to imagevar imageDom =
document.getElementById("Image_" + ${index});
// place transparent text in a div elementvar divBlock =
document.createElement("div");divBlock.style.background =
'transparent';divBlock.style.color = 'yellow';divBlock.style.fontFamily =
'Arial';divBlock.style.fontSize = '12pt';divBlock.style.fontWeight =
'bolder';divBlock.style.position = 'absolute';if ( dojo.render.html.ie )
{//divBlock.style.top = findPos(imageDom).y;divBlock.style.left =
findPos(imageDom).x - imageDom.offsetWidth;} else if ( dojo.render.html.mozilla
) {divBlock.style.top = findPos(imageDom).y -
imageDom.clientHeight;divBlock.style.top = 0;divBlock.style.top =
imageDom.parentNode.offsetHeight;divBlock.style.top =
imageDom.offsetHeight;divBlock.style.top =
dojo.html.getAbsolutePosition(imageDom, true,
dojo.html.boxSizing.BORDER_BOX).y;divBlock.style.top =
dojo.style.getAbsolutePosition(imageDom, false).y;divBlock.style.top =
dojo.html.getAbsoluteY(imageDom, false);
//divBlock.style.left = findPos(imageDom).x -
imageDom.clientWidth;}divBlock.style.zIndex = 10;
var textNode = document.createTextNode("${transparentText}");
divBlock.appendChild(textNode);
}
More data on this...
Layout widget does not work in firefox either.
Can anyone commment on these geometry position mgt variablesand how they are
suppose to be operated in firefox?
divBlock.setAttribute("dojoType",
"ContentPane");divBlock.setAttribute("layoutAlign",
"top");divBlock.style.zIndex = 10;
var textNode =
document.createTextNode("${transparentText}");divBlock.appendChild(textNode);
// now attach transparent text to imagevar imageDom =
document.getElementById("Image_" +
${index});imageDom.appendChild(divBlock);imageDom.setAttribute("dojoType",
"LayoutContainer");
?
I love the tapestry script... But I am Blue in the face...
Any help is greatly appreciated.
_________________________________________________________________
Now you can invite friends from Facebook and other groups to join you on
Windows Live™ Messenger. Add now.
https://www.invite2messenger.net/im/?source=TXT_EML_WLH_AddNow_Now
