Using button pics in a head menue

Taken From The Forum:
Forum Topic:
Last Updated: Saturday July 14 2012 - 06:07:47

Using button pics in a head menue

Poster: Doc-Holiday
Dated: Sunday December 3 2006 - 21:28:01 GMT

Hi there, I tried to use some button pics in a head menue, but I failed. Please have a look at http://www.bettycat.de/web/index.html to see my example. In the menue on the left, I use two button pics with a mouse-over effect and I want to use the same pics with the same effect in the head menue also. Any suggestions how to do that ?

Thanks in advance for your time and your help !

Poster: Ruth
Dated: Monday December 4 2006 - 11:41:03 GMT

Hi,

The first thing you need to do is upgrade to the newest menu version. We can't help with a version that old. Sorry. Too many things have changed, bugs fixed, parameters and options added in the 49 or so updates since that one.

Ruth

Poster: Doc-Holiday
Dated: Wednesday December 6 2006 - 13:57:04 GMT

Ruth wrote:

Hi,

The first thing you need to do is upgrade to the newest menu version. We can't help with a version that old. Sorry. Too many things have changed, bugs fixed, parameters and options added in the 49 or so updates since that one.

Ruth

Hi Ruth,

thanks for your reply. My customer is not willing to upgrade the menue version, heaven knows why .... but as you know, that´s the way it is :cry:

Anyway, I worked my way through all this and I was more than successfull. I managed to integrate all the pics and the buttons and it really looks amazing. there is only one little problem left and I would really appreciate your help, I´m sure it has nothing to do with the menue version. Please have a look at http://www.bettycat.de/web/index.html and choose "guitar" in the head menue, afterwards please choose "Testgitarre" (first button). The picture of the guitar will appear and you can click on the pic to open the corresponding webpage (that will be created later). When you have a look at the picture of the guitar you can see that one of the buttons is in the background and created a "tiled optic". How can I get rid of this problem ?

Poster: John
Dated: Wednesday December 6 2006 - 14:19:41 GMT

Hi Doc,

A few concerns. Your site appears to be commercial, but you are using the free menu. Commercial sites must purchase and register the system, which your customer has not done. Even if, for some reason, Milonic has given allowed you to use it free here (which I doubt), it still must be registered, which it is not.

Without having the current version of the menu in place, support is not available here (as stated on our downloads page, and also quite clearly by Ruth).

Sorry, but we can't help if your customer isn't willing to play fair.

Poster: Doc-Holiday
Dated: Wednesday December 6 2006 - 19:17:42 GMT

Hi John, I know what you mean but I can´t force him to do a upgrade and as you know, the customer is always king. From what he told me, he registered this version of the menue some time ago and he also showed me the copy of a bill he payed to Milonic. According to his former webguy, he received the information that it´s ok to use exactly this version of the menue he downloaded from the Milonic webpage.

I´m not very good at those law related things, sorry ... is there any way I can verify that it´s a registered version or that he´s really allowed to use it for a commercial webpage ? I don´t want to do any unfair and/or disallowed things.

Poster: John
Dated: Thursday December 7 2006 - 13:57:48 GMT

Hi Doc,

If he is licensed you should, of course, be using that version. By logging in to the download site at http://milonic.com/menuvinfo.php (you'll need to get that info from your customer or the old webmaster - it might not be the same as the login for the forum) you can go to My Milonic/My Licenses and it will show any that are active for your customer. By being logged in, a download at that point will automatically bring you the licensed version, assuming he is licensed. Another option might be the contact page at http://milonic.com/contactus.php.

Poster: Doc-Holiday
Dated: Thursday December 7 2006 - 15:39:24 GMT

Hi John, thanks for your help. I asked my customer for the login data an x-checked the things he told me and he really has licensed this version in April 2005. He also told me that his former webmaster contacted Milonic in the UK and he was told that it´s ok to use this officially downloaded version when he is licensed ... and so he´s still using it today. I wanted him to let me upgrade to the newest version as Ruth suggested, but he don´t want to ... never change a running system, it works great, why a upgrade etc. - I´m sure you know all this stupid user arguments

Am I now in for support ? If so, I would be happy if you could afford some time to have a look at http://www.bettycat.de/web/index.html and choose "guitar" in the head menue, afterwards please choose "Testgitarre" (first button). The picture of the guitar will appear and you can click on the pic to open the corresponding webpage (that will be created later). When you have a look at the picture of the guitar you can see that one of the buttons is in the background and created a "tiled optic". How can I get rid of this problem ?

Thanks in advance !

Poster: John
Dated: Thursday December 7 2006 - 16:39:53 GMT

Hi Doc,

Unfortunately, for support, we still have the same problem. The following from the download page...

All Versions below this line are now obsolete and are no longer supported.

The only version above the line (i.e., supported) is 5.765. We've had a number of discussions about this problem here, and trying to shoot a problem on an old version, where it may (or may not) have been fixed in a newer version, is a waste of everybody's time.

Also, with all the new browsers and upgrades out there, your customer is taking the chance that an old version of the menu might not continue to work. Doesn't make the site look too good.

Bottom line - there is no reason not to upgrade.

Poster: Ruth
Dated: Thursday December 7 2006 - 19:05:55 GMT

Hi Doc,

DISCLAIMER: This is a one time thing

Because you have been so nice and you made sure that the menu was a licensed version being used, I'm going to help you out. But, that's only because of the above and the fact that it is not a bug, design or fix issue. It's a lack of knowlegdge issue.

If you can at all get your boss to upgrade it would be the best thing, but he is entitled to use that menu forever since it's licensed, that is Milonic policy and it isn't going to change. With purchase the user gets 1 year of support either by support ticket or in the forum, and one year of upgrades, but after the year support needs to be renewed to continue to get it. Renewel is at a discount, but I think he's beyond the year date now for renewel. That would be something, if he's willing, you'd have to contact Milonic about as the new webmaster and it may not be something they can do since it's beyond a year and a half.

By the way, we are not Milonic, we are volunteers here who just happen to really really like this menu and think it is the best out there. And we like helping

Do you see the links below my name to Properties? Check out the Style and item properties, you'll see you can use the bgimage in the style where you have it or you can make a change in one item by coding a different bgimage in the item. I'd suggest a transparent bgimage and overbgimage [you need both]

Thank you for being such an honest person

Ruth

Poster: Doc-Holiday
Dated: Friday December 8 2006 - 9:20:11 GMT

Hi Ruth & John,

thanks to both of you of being so kind and helpful. Ruth, your help crossed my meeting with the customer and he will upgrade today. He contacted Milonic right now and as you said, he needs to renew his contract.

Anyway, to use the time until he cleared all the legal things, papers, payment etc. I downloaded the newest version of the menue as a sample version and loaded it up at http://www.bettycat.de/new/index.html

Thanks so much for your help Ruth, I will work my way through the links you told me and take care of the bgimage parameter. I will keep you informed if it worked out for me.

By the way, nice avatar cat pic you have, as you can see in my URL I also love cats

Greetings from Germany and thanks again

Doc

Poster: Doc-Holiday
Dated: Friday December 8 2006 - 10:30:15 GMT

Hey Ruth, thanks again so much for your help. I included a transparent background image for each item and it worked out from the start. Sometimes I get lost in such a huge number of parameters and possibilities and a little hint like this is exactly what I need then

Poster: Ruth
Dated: Monday December 18 2006 - 2:41:49 GMT

Hi Doc,

I've been playing with this to see if I couldn't make it into a 'dynamic' bgimage but unfortunately with that particular design I couldn't do it.

However, I did set up something that might make the menu not so sluggish on the mouseovers.

Put this into your stylesheet and call it on the kopf page or put it in the head of the kopf inside your existing style tags

Code:

.main{background: transparent url(images/button1.jpg) no-repeat top left;
    font-family:Verdana, Tahoma, Arial;font-size:75%;font-style:normal;font-weight:bold;
    color:#333300;text-decoration:none;padding: 0 0 0 10;}
   .mainov{background: transparent url(images/button2.jpg) no-repeat top left;
    font-family:Verdana, Tahoma, Arial;font-size:75%;font-style:normal;font-weight:bold;
    color:#ffffff;text-decoration:none;padding: 0 0 0 10;}
   .sub1{background: transparent url(images/button1.jpg) no-repeat top left;
    font-family:Verdana, Tahoma, Arial;font-size:75%;font-style:normal;font-weight:bold;
    color:#333300;text-decoration:none;padding: 0 0 0 10;}
   .sub1ov{background: transparent url(images/button3.jpg) no-repeat top left;
    font-family:Verdana, Tahoma, Arial;font-size:75%;font-style:normal;font-weight:bold;
    color:#ffffff;text-decoration:none;padding: 0 0 0 10;}
   .sub2{background: transparent url(images/transparent.gif) no-repeat top left;
    font-family:Verdana, Tahoma, Arial;font-size:75%;font-style:normal;font-weight:bold;
    color:#333300;text-decoration:none;}
   .sub2ov{background: transparent url(images/transparent.gif) no-repeat top left;
    font-family:Verdana, Tahoma, Arial;font-size:75%;font-style:normal;font-weight:bold;
    color:#ffffff;text-decoration:none;}

Then your menu data file would be this

Code:

fixMozillaZIndex=true; //Fixes Z-Index problem  with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=200;
_menuOpenDelay=100;
_subOffsetTop=0;
_subOffsetLeft=0;

with(background=new mm_style()){
offclass="main";
onclass="mainov";
image="images/transparent.gif";
imagepadding=4;
itemheight=25;
itemwidth=150;
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color=#FFFFFF', Direction=135, Strength=3)";

}

sub1=new copyOf(background); 
sub1.offclass="sub1";
sub1.onclass="sub1ov"; 

sub2=new copyOf(background); 
sub2.offclass="sub2";
sub2.onclass="sub2ov";


with(milonic=new menuname("Main Menu")){
alwaysvisible=1;
itemheight=25;
itemwidth=150;
left=10;
orientation="horizontal";
style=background;
top=10;
aI("showmenu=Bass;text=Bass;");
aI("showmenu=Guitar;text=Guitar;");
aI("showmenu=3rd party;text=3rd party;");
aI("showmenu=Electronics;text=Electronics;");
aI("showmenu=Accessories;text=Accessories;");
}

with(milonic=new menuname("Bass")){
style=sub1;
aI("showmenu=std;text=STD;");
aI("showmenu=lbow;text=L-Bow;");
aI("showmenu=soul;text=Soul;");
aI("showmenu=double;text=Double Neck;");
aI("showmenu=custombass;text=Custom;");
}


with(milonic=new menuname("std")){
style=sub2;
aI("image=images/productimages/standard.jpg;url=xxx.html;target=Haupt;");
}

with(milonic=new menuname("lbow")){
style=sub2;
aI("image=images/productimages/lbow.jpg;url=xxx.html;target=Haupt;");
}

with(milonic=new menuname("soul")){
style=sub2;
aI("image=images/productimages/soul.jpg;url=xxx.html;target=Haupt;");
}

with(milonic=new menuname("double")){
style=sub2;
aI("image=images/productimages/double.jpg;url=xxx.html;target=Haupt;");
}

with(milonic=new menuname("custombass")){
style=sub2;
aI("image=images/productimages/custom.jpg;url=xxx.html;target=Haupt;");
}





with(milonic=new menuname("Guitar")){
style=sub1;
aI("showmenu=stdguitar;text=STD Guitar;");
aI("showmenu=custom;text=Custom;");
}


with(milonic=new menuname("stdguitar")){
style=sub2;
aI("image=images/productimages/guitar.jpg;url=xxx.html;target=Haupt;");
}

with(milonic=new menuname("custom")){
style=sub2;
aI("image=images/productimages/custom.jpg;url=xxx.html;target=Haupt;");
}





with(milonic=new menuname("3rd party")){
style=sub1;
aI("showmenu=stick;text=Stick;");
aI("showmenu=viola;text=Viola;");
}


with(milonic=new menuname("stick")){
style=sub2;
aI("image=images/productimages/stick.jpg;url=xxx.html;target=Haupt;");
}

with(milonic=new menuname("viola")){
style=sub2;
aI("image=images/productimages/viola.jpg;url=xxx.html;target=Haupt;");
}




with(milonic=new menuname("Electronics")){
style=sub1;
aI("showmenu=preamp;text=BassXX Preamp;");
aI("text=BassXX Head;url=xxx.html;target=Haupt;");
aI("text=BassXX Power ;url=xxx.html;target=Haupt;");
aI("text=BassXX Piezo;url=xxx.html;target=Haupt;");
aI("showmenu=router;text=Stickrouter;");
}


with(milonic=new menuname("preamp")){
style=sub2;
aI("image=images/productimages/preamp.jpg;url=xxx.html;target=Haupt;");
}

with(milonic=new menuname("router")){
style=sub2;
aI("image=images/productimages/router.jpg;url=xxx.html;target=Haupt;");
}




with(milonic=new menuname("Accessories")){
style=sub1;
aI("showmenu=gigbag;text=Gigbags;");
aI("showmenu=strap;text=Slapstrap;");
aI("showmenu=strings;text=Strings;");
}


with(milonic=new menuname("gigbag")){
style=sub2;
aI("image=images/productimages/gigbag.jpg;url=xxx.html;target=Haupt;");
}

with(milonic=new menuname("strap")){
style=sub2;
aI("image=images/productimages/strap.jpg;url=xxx.html;target=Haupt;");
}

with(milonic=new menuname("strings")){
style=sub2;
aI("image=images/productimages/strings.jpg;url=xxx.html;target=Haupt;");
}

drawMenus();

That uses css for the bgimages and copyOf to create the 2 sub styles so they can call their own off and on classes. That means you don't have to code in all that bgimage= and overbgimage= into the various items.

[My cat picture is of Ruku's Karamelyn Kream. She's a Shaded Chocolate American Shorthair]

Hope this helps on your setup, it should make things easier since you don't have to do all the extra bgimage and overbgimage coding in each item.

Ruth

Poster: Doc-Holiday
Dated: Monday December 18 2006 - 9:04:01 GMT

Hi Ruth, thanks a bunch for your suggestion. I will use your code right now and see how it will work. Happy holidays to you !

Industrial Strength JavaScript and DHTML Menus

Using button pics in a head menue