Where is help these days? - SQL Server Forums

Please start any new threads on our new site at https://forums.sqlteam.com. We've got lots of great SQL Server experts to answer whatever question you can come up with.

All Forums

Development Tools

Other Development Tools

Where is help these days?

Author

Topic

SamC
White Water Yakist

3467 Posts

Posted - 2005-01-20 : 23:54:17

I need to implement a "help" capability on a web-based form page. My first thought was to use JavaScript to pop-up context-sensitive help on request. Given that blocking pop-ups is the rage these days, pop-up help is probably a bad idea.

I'd appreciate some suggestions. What has worked well for other web developers?

Sam

Merkin
Funky Drop Bear Fearing SQL Dude!

4970 Posts

Posted - 2005-01-21 : 06:14:40

Most popup blockers only block automatic popups. They recognise a popup triggered by a mouse click.

I'd say that it's still a safe option.

Damian

spirit1
Cybernetic Yak Master

11752 Posts

Posted - 2005-01-21 : 06:55:58

you could use tooltips...

Go with the flow & have fun! Else fight the flow

Seventhnight
Master Smack Fu Yak Hacker

2878 Posts

Posted - 2005-01-21 : 08:06:26

You could always simulate a popup....

click on the photo below, my photo section uses moveable windows that are built into the page. That way its not a real pop-up (which also saves on cost of opening a new browser window)

Corey

"If the only tool you have is a hammer, the whole world looks like a nail." - Mark Twain

spirit1
Cybernetic Yak Master

11752 Posts

Posted - 2005-01-21 : 08:14:51

you use a <div> corey, no?

Go with the flow & have fun! Else fight the flow

SamC
White Water Yakist

3467 Posts

Posted - 2005-01-21 : 09:32:09

quote:
Originally posted by spirit1

you could use tooltips...

Are you talking about an "ALT" or "Callout" ?

jhermiz

3564 Posts

Posted - 2005-01-21 : 09:35:18

quote:
Originally posted by SamC

quote:
Originally posted by spirit1

you could use tooltips...

Are you talking about an "ALT" or "Callout" ?

ALT is definately not a good help mechanism, I cannot say callout is..however is this C# ? You might be able to get away with callouts but I usually may use something like that for a basic tool tip. I still think context help is a much better solution.

Jon

Keeping the web experience alive -- [url]http://www.web-impulse.com[/url]
Imperfection living for perfection -- [url]http://jhermiz.blogspot.com/[/url]

SamC
White Water Yakist

3467 Posts

Posted - 2005-01-21 : 09:39:42

quote:
Originally posted by jhermiz
ALT is definately not a good help mechanism, I cannot say callout is..however is this C# ? You might be able to get away with callouts but I usually may use something like that for a basic tool tip. I still think context help is a much better solution.

Thanks... I wasn't suggesting ALT or Callout. I want to know what jhermiz meant when he suggested a tooltip?

spirit1
Cybernetic Yak Master

11752 Posts

Posted - 2005-01-21 : 10:31:01

you mean what i suggested?
well for tooltips we use hidden <DIV>'s that show on MouseOver event.

Go with the flow & have fun! Else fight the flow

jsmith8858
Dr. Cross Join

7423 Posts

Posted - 2005-01-21 : 10:57:47

for really short help, you can use the "Title" attribute of a <SPAN>, <A>, or <DIV> to show some tooltips when the mouse is over it, w/o needing to write javascript or using hidden DIV's at all. Not sure if this is standard HTML or IE-only, though.

- Jeff

SamC
White Water Yakist

3467 Posts

Posted - 2005-01-21 : 11:42:54

Sorry Mladen ...

So do you unhide the DIVs with JavaScript or CSS HOVER? How about posting a sample?

Jeff - I think the title="This is my help suggestion" will work in either IE or Netscape but not both.

So:

<div style="visiblity:hidden;z-index:100;border:1px solid navy;padding:1em;">
Help? I'm as confused as you are!<div>

Would do the trick nicely (CSS would better be in a class.) But then there's the problem of identifying a best method for a user to invoke the help? It is annoying if the HELP jumps up whenever a mouseover of a form element occurs. Maybe a separate "tiny" graphic icon for help next to the form element would avoid this problem? Are there better solutions?

Anyone have a JavaScript that will properly toggle the help-<DIV> visibility that's works well across different browsers?

Seventhnight
Master Smack Fu Yak Hacker

2878 Posts

Posted - 2005-01-21 : 12:18:36

Mladen - I use a combination of tables and divs. I also created a javascript calls object that refers to the 'window'. This allows me to set the title and the size and the layer ordering. In one case I also had a drop menu that was part of the window (you could set the menu up through the object as well).

I've tried a bunch of different things, but most of it was overkill for my photos

Corey

"If the only tool you have is a hammer, the whole world looks like a nail." - Mark Twain

spirit1
Cybernetic Yak Master

11752 Posts

Posted - 2005-01-21 : 12:22:32

this is how we do it...


<tr onMouseOut='hideTip()' onMouseOver='doTooltip(event,0)'>

<div id='tipDiv' style='Z-INDEX: 100; VISIBILITY: hidden; POSITION: absolute; BORDER-COLOR: Black; BORDER-WIDTH: 1px; BACKGROUND-COLOR: White; BORDER-STYLE: ridge'></div>

<script language="javascript">
// global
var xmouse, ymouse
var bShow

bShow = 0;
 
function doTooltip(eve, message_no) 
{
  document.all('tipDiv').innerHTML = '<font size=1>ToolTipText</font>'
		
  MoveTooltip();
  document.onmousemove = MoveTooltip;

  setTimeout("ShowTip()",100);
  bShow = 1;
} 
      
function MoveTooltip()
{
  	xmouse = window.event.clientX + document.body.scrollLeft;
  	ymouse = window.event.clientY + document.body.scrollTop;     
}
      
function ShowTip()
{
  	document.onmousemove = null;
			
  	if (bShow==1) 
  	{
  		document.all('tipDiv').style.left = xmouse;
  		document.all('tipDiv').style.top = ymouse  + 16;
   		document.all('tipDiv').style.visibility='visible';  
   		
   		bShow = 0;
	}
}
      
function hideTip() 
{
		document.all('tipDiv').style.visibility = 'hidden';
		bShow = 0;
}
</script>

Go with the flow & have fun! Else fight the flow

SamC
White Water Yakist

3467 Posts

Posted - 2005-01-21 : 12:27:48

Thanks! I'll give this a try tonight...

SamC
White Water Yakist

3467 Posts

Posted - 2005-01-21 : 13:00:32

The way these JavaScripts are coded -- the DIV ID is hardcoded in the JavaScript making it necessary to include a separate JavaScript on each Help item?

Sam

Kristen
Test

22859 Posts

Posted - 2005-01-21 : 13:05:11

Just pass the ID's "name" to the function that makes it visible / invisible

Instructions: Some coding is required to use this kit

Kristen

SamC
White Water Yakist

3467 Posts

Posted - 2005-01-21 : 13:08:09

quote:
Originally posted by Kristen

Just pass the ID's "name" to the function that makes it visible / invisible

I'm a weakling at JavaScript, but doesn't the parameter need to be declared in the JavaScript in order to pass the ID's "name"?

Kristen
Test

22859 Posts

Posted - 2005-01-21 : 13:32:45

Nope, you can pass it as a text string (representing the ID's name). You then need to convert the "name string" into an Object ID to manipulate it. We use the DreamWeaver/MacroMedia function for that


function myfnHideShow(strHideDiv, strShowDiv)
{
// Disables "hide" DIV and displays "show" DIV

//TODO Needs error handling to recover gracefully if DIVs not found
	var objHideDiv = MM_findObj(strHideDiv);
	var objShowDiv = MM_findObj(strShowDiv);
        objHideDiv.style.display = "none";
        objShowDiv.style.display = "block";
}

Let me know if you need the MM_findObj code - but I expect its on pretty much every page on the internet which was written with DreamWeaver!

Kristen

SamC
White Water Yakist

3467 Posts

Posted - 2005-01-21 : 14:23:28

quote:
Originally posted by Kristen

function myfnHideShow(strHideDiv, strShowDiv)

The function you posted has parameters coded (strHideDiv, strShowDiv) the functions posted by spirit1 do not (and I don't see how it could receive an ID as a parameter.

Sprit1's JavaScript (and others) depend on a single DIV to hold all the help text for any help on the page. The alt text is passed to the Javascript, which is fine for help with little or no layout.

I was looking for a help facility which would allow structure to the help content, e.g. a table of name/value pairs. In this case, it makes more sense to code a specific DIV with the content, which may have layout and styling, rather than trying to pass it all in a single line of text to the JavaScript.

I'd never checked out DW behaviors. Here I go...

Kristen
Test

22859 Posts

Posted - 2005-01-21 : 14:49:15

Sorry, you did say "weakling at JavaScript" and I've assumed ...

My function is used to simulataneously turn on a DIV and turn off another. You only want to turn ONE div on, and then later turn that on off.

So given:

<div id="tip001" onMouseOut='hideTip("tip001");' onMouseOver='showTip("tip001");' style="Z-INDEX: 100; VISIBILITY: hidden; POSITION: absolute; BORDER-COLOR: Black; BORDER-WIDTH: 1px; BACKGROUND-COLOR: White; BORDER-STYLE: ridge">Appropriate Help Text Here</div>

you would need some JS along the lines of (but untested!)


function showTip(strShowTip)
{
// Displays DIV with ID=strShowTip

//TODO Needs error handling to recover gracefully if DIVs not found
	var objShowDiv = MM_findObj(strShowTip);
        objShowDiv.style.display = "block";
}


function hideTip(strHideTip)
{
// Disables DIV with ID=strHideTip

//TODO Needs error handling to recover gracefully if DIV not found
	var objHideDiv = MM_findObj(strHideTip);
        objHideDiv.style.display = "none";
}

Kristen

SamC
White Water Yakist

3467 Posts

Posted - 2005-01-21 : 16:04:28

Is there a tool that allows stepping through JavaScript for debugging?

Next Page

Subscribe to SQLTeam.com

SQLTeam.com Articles via RSS

SQLTeam.com Weblog via RSS

- Advertisement -

Resources