Tooltips

Having problems with DHTML Menu? There is usually somebody here who knows the answer.
User avatar
thewolfe
Super Advanced
Super Advanced
Posts: 87
Joined: Thu May 20, 2004 10:44 pm

Tooltips

Post by thewolfe »

Hi Ruth,

Don't mind staying with Milonic if it will do what I want. So to reiterate, I want to have a word or a phrase on my site (not on the menu) and if you hold your mouse over it, it would popup a word, sentence.....

Why wouldn't I want to stick with Milonic with the expert tech support I get.

Also, on the new version of the menu, will it "splain" what I need to do to upgrade?

As always, thanks & blessings.

Doug
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Re: overLIB script ?????

Post by Ruth »

Hi,

As to the upgrade, since you have a professional license you are entitled to 1 year of upgrades free and 1 year of support free. After that, there is a reduced charge if you want to keep on upgrading or keep support from Milonic. To upgrade, you just go to the main site, login under the name you used when buying the menu. Just below the login place you'll see - Current Menu Version: 5.915 dated Wednesday July 4 2012 Click to Download- Click that link on the main site after login and you will get a zip file containing the same thing that was in your original zip file but with the new version of the program files. This is what I do, I have a folder called Milonic and in that folder another called version. I download the file to that version folder. The reason is, I make sure I keep all the versions because I help here, but you should keep the last version you had which worked on your site so that if the new version has a problem you can go back to the old one. The only thing you would do on you site is to upload the milonic_src.js and mmenudom.js files, nothing else, well if you use the tooltips, then you should also upload that module. Your data file, the one called homepage menu array just stays as is since that is your created file.

OK, after that long explanation we can do tooltips. The easiest way to do that is for you to actually tell me what you want in that column. If you could give me a couple of questions or such then I could set up how to do it and post for you, from that you should be able to figure out what you want for the rest of them and do them yourself. Also, do you want it to be just a 'tip' or you could put it in a 'bubble' Actually, I can give you an example of that when I do them and then you can decide. You can also decide on colors, the usual tooltips tip is yellow, but since that column is yellow you should probably change the background color, maybe the light or even the dark blue like your buttons.

Ruth
User avatar
thewolfe
Super Advanced
Super Advanced
Posts: 87
Joined: Thu May 20, 2004 10:44 pm

Re: overLIB script ?????

Post by thewolfe »

Hi Ruth,

I have added the following question In the bottom of the left-hand column "After what incident did God give man permission to eat meat?" and would like the answer (tool tip) to pop-up when the mouse is held over the question.

Let me know if this is an adequate explanation.

Thanks & blessings,

Doug
User avatar
thewolfe
Super Advanced
Super Advanced
Posts: 87
Joined: Thu May 20, 2004 10:44 pm

Re: overLIB script ?????

Post by thewolfe »

I could also add the word "Answer" under the question so we could add the tooltip to that.

The Flood (Gen 9:3-4)
User avatar
thewolfe
Super Advanced
Super Advanced
Posts: 87
Joined: Thu May 20, 2004 10:44 pm

Re: overLIB script ?????

Post by thewolfe »

Hi Ruth,

Hope you haven't done anything or at least too much.

Here's the latest thought.

After what incident did God
give man permission to eat
meat?

Answer

I uploaded the change.
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Re: Tooltips

Post by Ruth »

Hi,

OK, sorry it took so long, but I wanted to give you at least two options. What I have done is upload your page to the support area with both options on it. Let me know which you want to use and I'll fix up the tooltips accordingly. What I did was provide a 'plain' tip and then one that has an image in it. I won't get my feelings hurt if you don't want the image, but if you want it, you're welcome to it, I give permission :)

If you like the idea of an image, but not the one I made, I'd be glad to try and make whatever you would prefer. We can't all have the same artistic taste or it would be a boring world :) and you might prefer a plain tip for the answers. As soon as you let me know which you would prefer I'll get the stuff to you. Let me know once you have seen and decided so I can remove the page from here.

Link Removed : Aug 3, 2012

Ruth
User avatar
thewolfe
Super Advanced
Super Advanced
Posts: 87
Joined: Thu May 20, 2004 10:44 pm

Re: Tooltips

Post by thewolfe »

Hi Ruth,

Thanks again for all your help and the winner is....the first one w/o the image although I'm going to keep that function in mind. I may have another use for it down the line.

Thanks & blessings,

Doug
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Re: Tooltips

Post by Ruth »

Hi,

You're welcome to keep it. Sorry it took so long, I lost power, looks like my main breaker is getting ready to give up the ghost, really hot.

OK, here are the instructions:

1. Open the tooltips.js file that came with your download. It's in the modules folder. Once opened save it as something else i.e. mytooltips, or mytips or whatever you want it to be. That way you will always have the original one if you need it :)

2. Copy and paste the following in the related section of the tooltips file, whatever you have named it. You'll be pasting it over the existing same thing which has different colors in it. When you open it you'll see the following section with different color, settings etc. This is the only part of that file that is user editable. Don't change anything else, that is all the programming code that makes it work :)

Code: Select all

with(M_toolTipStyle=new mm_style()){
    offbgcolor = "#FFFFE1";
      offcolor = "#4275fd";
   bordercolor = "#0000CC";
   borderstyle = "solid";
       padding = 2
   borderwidth = 2
      fontsize = "12px";
     fontstyle = "normal";
	 fontweight ="bold";
    fontfamily = "Adelon, tahoma, verdana";
    overfilter = "Fade(duration=1.2);Shadow(color='#777777', Direction=135, Strength=5)"
    outfilter = "Fade(duration=1.6);Shadow(color='#777777', Direction=135, Strength=5)"
}
with(new menuname("M_toolTips"))
{
	top="offset=-20"
	left="offset=40"
	style=M_toolTipStyle;
	margin=4
	if(_W.M_maxTipWidth)maxwidth=M_maxTipWidth
	aI("text=;type=ToolTip;");
}
drawMenus()
3. Save the file then upload it to your website in the same place as the milonic files and page etc.

4. Open your page and add this right after the 1homepage menu array call. I'll put both here so you see what it will be on the page

Code: Select all

<!-- The next file contains your menu data, links and menu structure etc -->

    <script type="text/javascript" src="1homepage_menu_array.js"></script>
    <script src="tooltips.js" type="text/javascript"></script>   
    <!-- **** End JavaScript Menu HTML Code -->
You should also remove the extra call for the menu array file, there should only be one call for it.

5. Also on the page add this css coding at the top in the head section. This is needed to keep the word Answer from being underlined, to make sure of the font-family choice and the text color, making sure it is red instead of 'link' blue :)

Code: Select all

<style type="text/css">
.answers {font-family:Adelon, tahoma, verdana, san-serif;color:red;text-decoration:none;} 
</style>
6. Finally, go down to where you have the question and the word Answer. The word answer should be like this:

Code: Select all

	<p>
<a href=# class='answers' onmouseover="showtip('After The Flood (Gen 9:3-4)',null,100);" onmouseout=hidetip();>Answer</a>
<br><br>
</p>
That's it. Seems long but just takes time to explain, not really involved. Since you are not using the image, you do not have to do anything in your menu array file. If you decide later to use the image in only some places, let me know and I'll show you how to set that up, that you need to set up inside the menu array since you wouldn't want it on every item.

Let me know when it's done so I can check it out!

Ruth
User avatar
thewolfe
Super Advanced
Super Advanced
Posts: 87
Joined: Thu May 20, 2004 10:44 pm

Re: Tooltips

Post by thewolfe »

Hi Ruth,

I think I'm good until #6 I'm not sure what to do with that script.

Also, on #2 & 3 I renamed the file to "my_tooltips.js" copied the new code into it and then uploaded it. Is that correct?

On #6 my page has:

After what incident did God give man permission to eat meat?</font></b></p>
<p><i><font color="#FF0000" face="Adelon"><b>Answer</b></font></i></p>

Where does the following go?

<p>
<a href=# class='answers' onmouseover="showtip('After The Flood (Gen 9:3-4)',null,100);" onmouseout=hidetip();>Answer</a>
<br><br>
</p>



Blessings,
Doug
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Re: Tooltips

Post by Ruth »

Hi,

Darn, you are right, that's not very clear! That's what happens when you are the one doing it, rather than trying to figure it out.... In place of

Code: Select all

<p><i><font color="#FF0000" face="Adelon"><b>Answer</b></font></i></p>
you should put what I posted in #6. In that a href link thing the class='answer' will do all the font family, the font color and the no underline of that word. So to make it easier so you don't have to look back, here is what you are putting in place of the above.

Code: Select all

<p>
<a href=# class='answers' onmouseover="showtip('After The Flood (Gen 9:3-4)',null,100);" onmouseout=hidetip();>Answer</a>
<br><br>
</p>
Oops, I just realized the bold, italic for the word Answers is not going to be read from the tooltips file, only for the actual answer, that is the actual tooltip takes the info from the js file .... Darn. So you need to make that #5 I posted previously, the css class the following [sorry]

Code: Select all

<style type="text/css">
.answers {font-family:Adelon, tahoma, verdana, san-serif;font-size:14px;font-weight:bold;font-style:italic;color:red;text-decoration:none;} 
</style>
That will make the other coding, i.e. the b for bold is the font-weight:bold; and i for italic is the font-style:italic, and I added a font-size of 14px. You can change that to what you want or leave the font-size out of the css class and it will take the users default sizing.

Hope that helps. Oh, and don't forget you have two calls for the 1homepage_menu_array.js file and eliminate the last one.

Ruth
User avatar
thewolfe
Super Advanced
Super Advanced
Posts: 87
Joined: Thu May 20, 2004 10:44 pm

Re: Tooltips

Post by thewolfe »

Hi Ruth,

I'm toast. I've been trying to follow next to last post and then the last post and I'm lost.

My fault but I don't know what I've changed on what files..........looking at one post and then my page and then the other post and then...........

I don't care how long it takes you to get back with me but can you give me the steps to add the tooltip from start to finish so I can delete the files I've changed and start over completely.

And I'm sure I'm not the only "project" you have going so if it's asking too much, I understand.

And hope your breaker is holding up. Electricity is like a lot of things that we just take for granted until it's not there.
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Re: Tooltips

Post by Ruth »

No Problem at all. Do you have a test page help. It will help me figure out where I explained wrong. I will bet you that I did something that messed up the explanation. Again, that is the problem that happens when the 'explainer' [me :) ] kind of knows without thinking what to do, and then explains it [again :lol: without thinking]

In the meantime, I am going to actually put together your page with the code and a tooltips already done and zip them for you. That way I can put the explanations in the little yellow colored 'notes' actually on the page, how's that? But, if you have a test page up or can put it up with what you've done, it would help me catch what I didn't explain correctly. Thanks so much

The electricity is now working, at least it is jury-rigged [what an odd word] I am in one of those catch 22 thingees. My electric panel is original to the house [1955], it is only a 50amp panel total, the breakers are what is called obsolete. I am going to change it out, but I first have to get an appraisal for the re-finance which gives me enough to do that change, but I can't do the appraisal until I finish the last couple of requirements, like having a working kitchen with a sink, which I can't finish unless I have electricity to use the tools, like saw and such. Anyway, I did find a 40amp main breaker for this old panel and replaced that 50amp which was fried, literally, and removed the freezer from use which seems to be what caused the issue.

I'll get back to you pretty quick with page and tooltips. I'm not sure which tips file you are using, but I have the one that came in the 5.915 version, so if you are not up to that version, you will need to take the tooltips you are using for your version and make any changes.

Ruth
User avatar
thewolfe
Super Advanced
Super Advanced
Posts: 87
Joined: Thu May 20, 2004 10:44 pm

Re: Tooltips

Post by thewolfe »

Sorry, both files are exactly like the original, just renamed. I deleted the ones I was working on and started from scratch. I don't think it was anything you did, more of me getting lost as I went back and forth between your post and FrontPage.

my_tooltips.js under milonicmenu/extras/tooltips and index test page is at dougsstuff.com/index_tooltip.htm

By the way, when I'm helping people with computer problems I always have to remember to takes baby steps and not assume they know much, which is usually the case. Like when I'm on the phone with someone and am able to see their computer and I say "ok, click on the "start" button or "Windows" key and I see their mouse wondering slowly around their desktop. Now that's me wondering around the code.

Not sure what version of tooltips I have except I haven't download the latest Milonic version you were talking about the other day.
How do I ck my version?

Anyway, as always thanks and let me know if you need more info.

And last but not least, I pray you get all your ducks in a row to get your breaker fixed.
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Re: Tooltips

Post by Ruth »

Hi,

OK, here is a zip file http://support.milonic.com/ruth/thewolfe/tipsstuff.zip with the page index_tooltip that has all the coding and the yellow comments for what was done, and the my_tooltips.js file in it. So, you should be able to just upload the my_tooltips.js file and that page. They will write over the ones you have up, but since the page is a test page and not your main index that's fine. Once you see it and see it works you can then save it as your regular index page.

I will post back here with the explanations step by step later today so you have the explanations in order of how to do it, so you can do anything you want on your own.

Ruth
User avatar
thewolfe
Super Advanced
Super Advanced
Posts: 87
Joined: Thu May 20, 2004 10:44 pm

Re: Tooltips

Post by thewolfe »

Cool! I'll give it a try soon.

Thanks,

Doug
User avatar
thewolfe
Super Advanced
Super Advanced
Posts: 87
Joined: Thu May 20, 2004 10:44 pm

Re: Tooltips

Post by thewolfe »

Hi Ruth,

Here's the latest.

I uploaded your "my_tooltips" to dougsstuff.com\milonicmenu\extras\tooltips and uploaded your "indextest" and renamed it to index.htm

I'm missing a couple of images..no biggie but the tooltip isn't working......if I've done it correctly.

What did I miss?
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Re: Tooltips

Post by Ruth »

Hi,

OK, I am giving you a new zip file. http://support.milonic.com/ruth/thewolfe/tipstuff.zip

Do this:

1. unzip the file to a folder, its own folder to start. Later you can put the things wherever you want but for now make a folder for these files maybe named mytooltips.

2. You will see 4 items in that folder, the index_tooltips page, the my_tooltips.js file, and two images which will show. Something in Microsft is changing the name, I think because your original images might have a space or something in the name. Anyway, now you have tips&tricks_blue.jpg without any extra whatever in the name and also iPod&iPad_blue_.jpg, and I have put that name in the places for those images.

3. Once you have these files in their own folder, just upload those four files to your root directory, that is the dougstuff main directory where all the other files are. Once you do that you should be able to go to http://www.dougstuff.com/index_tooltips.htm page and everything should work. When you upload this new index_tooltips page it will just overwrite the old one. If it is as you like it, then all you have to do is rename the page to index so that it replaces your now existing index page.

Somewhere along the line I think we got confused as to where to put the files. Since you don't seem to have folders where you put images or js files or css files, then everything gets uploaded to your main directory. Wherever you now have your milonic_src.js file, mmenudom.js file, 1homepage_menu_array.js file, your images, that's where you put the tooltips page and the new images and the new my_tooltips.js file because that is where the calls for the files are pointed.

Let me know if it doesn't work. I'll have to figure out what's going on.

Ruth
User avatar
thewolfe
Super Advanced
Super Advanced
Posts: 87
Joined: Thu May 20, 2004 10:44 pm

Re: Tooltips

Post by thewolfe »

Hi Ruth,

Scared me for a minute cause you left out an "s" and the site wouldn't load. http://www.dougstuff.com/index_tooltips.htm
but all is well.

Now I will change my file names so the don't have any spaces and rename the files.

Do you normally put all the image files in a folder and then "point" to them and the same with all the Milonic files....etc?

That would make it easier to find stuff for sure. I might try that down the line but I want to make sure all is well before I start moving files around.

I'll rename the index file today and make sure I don't mess anything up and then maybe try to clean things up a bit.

I just have to remember that when I change a file name I have to figure out where else that file name is so it gets changed.

Once more you've saved the day but stay tuned because I'm sure there's another villain just around the corner.

Wish I could do something to repay you. Can't thank you enough.

Blessings,

Doug
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Re: Tooltips

Post by Ruth »

Hi,

Well, something is wrong someplace since that link gives me a page not found. Anyway, I looked at your main page and see that the tooltips are working. Now as to the images. Are you uploading these pages using a microsft product of some kind? Dreamweaver, or anything because I see microsoft coding like schema and such. If so I will bet that the program is changing the names of the images because you have an ampersand in them, i.e. tips&tricks, ipod&ipad. The best thing you could do is not use those in image names, try doing things like tips-tricks and so on. If that's the case I can redo and rename the images and put them up. I think with the - instead of ampersand we won't get that %250 and such which is the problem.

Ruth
User avatar
thewolfe
Super Advanced
Super Advanced
Posts: 87
Joined: Thu May 20, 2004 10:44 pm

Re: Tooltips

Post by thewolfe »

Hi Ruth,

It's good to go at http://www.dougsstuff.com/

The file names do have spaces in them so I'll change them along the way and use your files until I get them uploaded.

I''m still using my good old free 2003 FrontPage and uploading using Filezilla.

But the world is back in balance.

And again.....thanks
Post Reply