Likno Blog – Drop-Down Menus, Javascript Menus, CSS Menus, jQuery Scrollers/Sliders, Modal Windows and more...

Knowledge Base support case for AllWebMenus, abstracted and stripped of all user’s private info.

Initial Email From: Michele
Initial Email Subject: Need help please
Support Case Month: June 2012

Greetings,
I cant seem to find an answer to my question elsewhere, so, I am designing a website that is based on percentage and not pixels, it is set to be 76% of window size.  I am placing the menu at the top, within a table, centered. However, it will not stay within the table and hangs over the page on either side.
I had to insert some html so that the menu would appear over the flash movie, but this "hangover" is on every page, not just the one with the flash.
I know the menu would have to adjust itself along with the webpage according to browser specs, I also know the menu actually appears "above" the page, and is not part of the page. So, that said. I am at a loss as to what to do.
Any suggestions would be appreciated.
Thank you,
Michele

Reply From: Likno Customer Support

Dear Michele,

It seems that the menu works fine as long as the browser window is wide enough.

From this I gather that you have correctly set the “menubar” settings. However you also have significant paddings in your menu that do not allow it to become smaller than a given width.

Please check the following properties and change both the padding and margin to 0:

Best Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Michele

Thank you for your quick reply. I changed the padding settings to 0 as you suggested and when I view the pages "live" within Adobe Dreamweaver everything looks perfect!  The menu is perfectly aligned on all pages.  But once they are uploaded to the server the pages do not appear the same. The menu sits above the table. I tried changing the vertical align to top, bottom, middle, but nothing changes. I have the valign set at default now. I uploaded all the awmdata files as well as the menu.js and the pages themselves, still once it is online, it will not line up. I am at a loss.
Thank you,
Michele

Reply From: Likno Customer Support

Dear Michele,

Is your menu still set as a menubar? Can you export and send me your menu project so that I can further research this?

Best Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Michele

Hello Kostas,
As requested, I have attached the zipped file.
I should tell you that this menu is from one of the pre-made templates. I have made many menus using this program, but never one this fancy. I had changed the base color, but went back to the original. It was never saved as a menubar.
I have another machine with a 15" screen. That one shows the menu sitting just above the table where it should be nested. In 17" everything is fine. My client wants a "flashy" navigation bar and I am not great at doing that from scratch so I thought this would be the answer.
Thanks for your assistance.
Michele

Reply From: Likno Customer Support

Hello,

I have made some minor changes to your menu to make it look better.

1) added a minimum width to the main menu group

2) removed the “distance between items” that created something like a border

3) added a normal border so that it is also visible before the first and after the last item.

To complete the changes, you can also change the following in your page, from:

To:

style="background-image: url(awmdata/menu/menuItem-tile.jpg);" bgcolor="#474747"> 

Best Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Michele

Thank you so much. I will try this.  Not so sure about the border before and after. It took me forever to figure out how to get rid of that. LOL   I will see if I can figure it out again. :-) 
I'll let you know how I made out.
Thank you again and again.
Michele

Reply From: Likno Customer Support

Dear Michele,

If you want to remove the border, you can do this here:

Best Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Michele

Hello Kostas,
Oh dear! It is not perfect on my screen here at work. It looked good from home, but not here. It is "hanging" again. Just a tiny bit on each side, but enough to be noticeable. It's fine on the index page, but the others, not so much. All the pages are set at 75% so I don't know why it would be different on all but the index page. I changed the awm code to below, as you so graciously provided and it was great, until I had to add a link.

<td height="32" style="background-image: url(awmdata/menu/menuItem-tile.jpg);" bgcolor="#474747"><div align="center" id="awmAnchor-menu"></div></td>

Also, last night I tried to update my version of AllWebMenus PRO with latest version. But when I tried to download the program from your primary download location, I kept getting a message saying windows couldn't locate something or other. I was so tired at that point, I didn't attempt to try it again. I will try it again tonight and let you know what the error message is saying.
I bet you just wish I would go away! LOL
Michele

Reply From: Likno Customer Support

Are you referring to this?

I had to zoom my browser in order to notice that the menu is a pixel or two off on the right side!

I guess this is because after you added the new item the menu became just a bit too big. Two things can help resolve this issue:

1) decrease the item padding (if there is any):

2) make sure that the “Uniform Items” property is NOT checked:

Best Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Michele

Greetings,
Yes, I worked it out. I followed your directions and it works great now. Thank you again.
Now I have to figure out why I cant download the newest version of AllWeb. I didn't try it last night, I was too tired.  Will try it tonight.
Thank you, Kostas.
Michele

Knowledge Base support case for Likno Web Modal Windows Builder, abstracted and stripped of all user’s private info.

Initial Email From: Stanley
Initial Email Subject: Help for Likno Web Modal Windows Builder
Support Case Month: March 2012

Dear Support,

May I know is there any way to put % for width and height? (the reason why I like to switch from lytebox to model window is because of % for width and height in lytebox has compatibility issue with IE)

Regards,

Stanley 

Reply From: Likno Customer Support

Yes, on the link values, use something like this:

<a href="havascript:void(0);" onclick="openModal('/CardScan_feature.html','50%','40%');">Click Here</a>

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Stanley

Dear Support,

1) I've tried that but did not work (passing width and height in %)

2) How to pass the title to each modal window? (it has the same title for each modal)

Regards,

Stanley

Reply From: Likno Customer Support

I just tried it in your online page, and the size worked fine…

If you want to also change the title, then you need to add this too in the function..

The link should be:

openModal('CardScan_feature.html','80%','40%','the title');

and the function:

function openModal(url, w, h, t) {

        cardScan({bodySource:"<div externalUrl='"+url+"'>",containerCss:{width:w, height:h},header:{text:t}});

}

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter