Click here to Skip to main content
11,578,524 members (59,493 online)
Rate this: bad
good
Please Sign up or sign in to vote.
See more: Javascript
I have a tree view.In child node, Onmouseover, I have to display some contents on a tool tip or popup. The content is large. As of now, i have used a popup, which is not looking good. Tooltip seems to be neat, but all my contents are not getting displayed.. Is there any way to sortout this one.. Please help,

Thanks
Posted 8-Oct-12 19:42pm
Comments
enhzflep at 9-Oct-12 1:52am
   
Not that I know of, off the top of my head - need more details first. The tooltip expands to just large enough to display it's contained text. When you say some of you content is missing, what precisely?
Moreover, what is the element's title and what is the text of the displayed tooltip?

It's not terribly difficult to replace it's functionality with your own. But first of all, perhaps there is a way to make the current one's appearance more pleasing.
Anusha Sridhar at 9-Oct-12 1:59am
   
var oPopup = window.createPopup();
function richToolTip(Target) {
var lefter = event.offsetY + 0;
var topper = event.offsetX + 15;
oPopup.document.body.innerHTML = '<div style="position: absolute; top: 0; left: 0;' +
' border: 2px solid black; ' +
'font: normal 10pt tahoma; filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,' +
' StartColorStr=gold, EndColorStr=#FFFFFF); padding: 10px;">' +
'Node Name
Node Name:' +
Target.innerText +
'
<br/><img src="http://peoplewithmedicare.tmf.org/Portals/17/Icons/icon_excel.jpg" alt="Image"></img> <br/>' +
'
</div>';
oPopup.show(topper, lefter, 170, 120, RFPPlaceHolder_TVContent);
}
function AddAttributes() {
debugger;
var TreeNodes = RFPPlaceHolder_TVContent.getElementsByTagName('TABLE');
for (var i = 0; i < TreeNodes.length; i++) {

TreeNodes[i].onmouseover = function setToolTip() { richToolTip(this); };
TreeNodes[i]. önmouseout = function removeToolTip() { oPopup.hide(); };
}
}

This is the javascript code i have used for popup

1 solution

Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

Ahhhh. Just saw this question again, you've hit the "Have a Question or Comment" button on the left. This sends an email notification to the poster of that Question or Answer. When replying to a comment, you need to hit the [<-- Reply] button on the right-hand side of the comment.

Anyhow, here's a quick whip-together job that gives you a pop up that works like a tool-tip. You an chuck html into be displayed too.
http://jsfiddle.net/enhzflep/U3qys/[^]


Here's the one I made and an example of it's use. Obviously, you could add an attribute to the elements (perhaps mTitle) and set this to contain the tooltip's html for that element. Then you can set the contents of the popup window to reflect the value of mTitle.

I'm not sure, but perhaps you can add a style that will disable display of the standard tool-tip. If so, it would make your html cleaner and avoid any potential troubles with using custom attributes. I just read yesterday of old code that added an attribute 'translate' to elements. This used to be fine - 'recently' this attribute was added to the official spec - causing all sorts of trauma to the maintainer. poor sod!
  Permalink  

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 Peter Leow 135
1 OriginalGriff 113
2 Richard MacCutchan 85
3 Afzaal Ahmad Zeeshan 75
4 Frankie-C 75
0 OriginalGriff 933
1 Sergey Alexandrovich Kryukov 740
2 Abhinav S 573
3 F-ES Sitecore 420
4 Suvendu Shekhar Giri 403


Advertise | Privacy | Mobile
Web03 | 2.8.150603.1 | Last Updated 29 Oct 2012
Copyright © CodeProject, 1999-2015
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100