20

Dec 10

DHTML Menu Tutorial: Resetting the Vertical Menu Position

The initial vertical position of a floating menu is often lower on the page than it needs to be when the page is scrolled. On this site, for example, the initial “Y” coordinate is 140 pixels below the top of the page in order to leave room for the page header. However, as the page is scrolled, the menu would look funny if it were a third of the way down the page, so, when the page is scrolled, the menu is only 10 pixels below the top of the page.

Here is how to change the initial “Y” coordinate from 140 pixels to 10 pixels when the page is scrolled:

1. Select the first menu item in the Menu Tree (the item just below <Top-level Menu>) and select Condition under Menu Item Settings.

2. Enter the following code in the Prefix window:

var myitem=

3. Enter the following code in the Suffix window:

myitem.oParMenu.iY=”Math.max(140,stgct()+10)”

In the code you enter in the Suffix window, be sure to change “140” to the initial Y coordinate of your floating menu.

The tutorial is from the warm-hearted DHTML Menu users

Posted in Tutorial Release | 2,235 Comments
Tags: , , , , ,

17

Dec 10

5 Great jQuery Menu Samples

jQuery framework has been a hot topic these few years in web design and development. New tutorials, new techniques and cool effects are being released by developers everyday.As a jQuery lover, I always find myself trying to invent something really cool, useful and able to integrate into design easily. This time, I’ve chosen 5 very useful and helpful navigation menu samples to share with you.

Posted in Latest Samples | 2,452 Comments
Tags: , , , ,

16

Dec 10

DHTML Menu Tutorial: Creating Menu With Transparent Background

In order to create a DHTML Menu with a transparent background, there are three places where the background must be set to transparent:

1) Select (highlight) <Top-level Menu> in the menu tree, go to Popup Menu – Background, and check Transparent.

2) Select (highlight) all menu items (Edit > Select > All Items), go to Menu Item – Background, and check Transparent for both Mouse out and Mouse over.

3) With all menu items still selected, go to Popup Menu – Background, and check Transparent.

Here is a sample menu with a transparent background:

Posted in Tutorial Release | 2,093 Comments
Tags: , , ,

15

Dec 10

5 jQuery Drop Down Menu Solutions

Hello again, it’s time for comprehensive programming article. Here you’ll find 38 mainly jquery based drop-down or just multi level menu. My favorite here is the first pick – Outside the box with very unique navigation menu. It’s always good to have such reference articles in your bookmarks and when you have to create some really big website with a lot of content and menu sections – just return here. Shorten your developing process with already premade menus.

Article from 1stwebdesigner.com

Posted in Latest Samples | 2,255 Comments
Tags: , , ,

14

Dec 10

Tutorials from Sothink DHTML Menu users: Incorrect path to menu and resources

This is not a tutorial site. Sothink has an an extensive DHTML Menu Tutorial Center with tutorials on getting started and more advanced subjects. Also, the DHTML Menu program has a Help section. The suggestions we offer here are based on our use of DHTML menu They work for us, and they might work for you, too. Before we start with the step-by-step instructions, here are three recommendations that we feel are important:
•    Use DHTML menu as a standalone program. If you use Adobe GoLive, Dreamweaver, Expression Web, or FrontPage you may be tempted to integrate DHTML menu with your Web authoring software using one of the plug-ins supplied with DHTML menu. Do not succumb to the temptation; if you do, you are making more work for yourself and asking for trouble.
•    Do not include menu code in your pages. Always generate a JavaScript include file. There are many advantages to having your menu in an external JavaScript file, but perhaps the most important advantage is that you only have to edit and upload a single file whenever your menu changes.

Read on »

Posted in Tutorial Release | 2,047 Comments
Tags: , , ,

13

Dec 10

6 Unusual JavaScript Navigation Menus

What is one of the aspects of a website that always needed? It is the navigation menu. Navigation menu is a useful part of the website because it leads the user to different part of the website. Interaction to the website is the main use of the navigation menu. More and more great looking and user-friendly navigation menus are being created that gives  life to the websites.

I’ll be featuring 6 great looking and really unusual navigation menus which JavaScript-based menus.

js navigation menudhtml menu Read on »

Posted in Latest Samples | 970 Comments
Tags: , , , ,

10

Dec 10

Horizontal Navigation Menu for Website

Main Navigation Types & Usability
Main navigation, also known as global navigation (if the navigation is always present on each page) is a crucial element for web site or web-based application usability. There are many variations of main navigation systems, however for the vast majority of existing web sites or web-based applications* there are four primary types:

  • Horizontal Menu
  • Vertical Menu
  • Inverted
  • Mega Footer

Which main navigation system is used depends on several variables, including;

  • Information architecture of the site
  • Screen size or typical location of use of the web site
  • User needs including any special accessibility issues

The screen size issue is a very important consideration now that more and more users rely on mobile devices to find and access content and functionality.  With mobile screen size being extremely limited vs. typical displays in homes or offices, It is important to consider which type of main navigation will work best for each environment.
The main navigation type chosen will have a direct and significant impact on the usability of a web site, and because of this great care should be taken before deciding on a navigation type. From a usability standpoint, there are multiple benefits and challenges for each primary type of navigation.
Main Navigation– Horizontal Menu
Horizontal menus have links placed across the page, well, horizontally. This has a tendency to work well for Western cultures, in which reading from left to right, top to bottom is the norm. Horizontal menus align with Western users’s expectations for important content being at the top of a page.

First level horizontal menu items Subject 1, Subject 2, Subject 3
Typically horizontal menu bars are located at the top of the page, but there are several notable exceptions to this rule, including the home page of Blogger.com, which has the main navigation at the bottom of the page.

Blogger.com home page horizontal main navigation is located at the bottom of the page.

This article is from usefulusability.com

Posted in Tutorial Release | 2,338 Comments
Tags: , , ,

9

Dec 10

5 new-arrival free tree menu templates in Sothink Tree Menu

With Sothink Tree menu 3.0 release, add 14 free menu templates in the program. Below will show 5 favorite menu samples:

Posted in Menu Release | 2,912 Comments
Tags: , , ,

9

Dec 10

Sothink Tree Menu 3.0 Supports Windows 7 & IE 9 Beta

Sothink Tree Menu releases its new version 3.0 recently, which supports Windows 7 and IE 9 Beta. As quality seekers, maybe the web designers need to create tree menu on Windows 7, and viewers the same with you, they would like to enjoy navigation tree menu in IE 9 Beta. Sothink Tree Menu enables you create DHTML tree menu on Windows 7, and generate the web menu compatible with IE 9 Beta. What’s more, this tree menu builder provides 50+ free tree menu templates to match with various website styles; versatile image library available; fully customize menu style. Seamlessly integrate with DW, FP and EW.

First at all, check out stunning tree menu samples in IE 9 Beta:

tree-menu-builder

Read on »

Posted in Menu Release | 2,823 Comments
Tags: , , , , ,

6

Dec 10

Anchor the Floating Menu in the Center

If the window is full screen, positioning the menu in the center is easy; if not, you can see the samples, which keeps the menu in the center.

http://www.sothink.com/product/dhtmlmenu/store/floatcenter/floatingcenter.htm

The sample can be remained with users as scrolling the page. The location of menu always lies in the center according to the page size. This is a special alignment pattern of floating menu.

Steps:

  • Click Global > Menu Type, select Float in Menu Type.
  • Choose the first menu item, and click Condition in Menu Item.
  • Enter the responding code below into the Prefix in Condition.
    Center Horizontally
    _STNS._aStMenus[_STNS._aStMenus.length-1].iX=”Math.max(stgcl()+parseInt(_STNS.fiGetCW()/2-_STNS.fiGetEleWid(_STNS.fdmGetEleById(_STNS._aStMenus[_STNS._aStMenus.length-1].aPopups[0].sUid))/2),0)”;
  • If you want to set menu alignment as Center Vertically:
    _STNS._aStMenus[_STNS._aStMenus.length-1].iY=”Math.max(stgct()+parseInt(_STNS.fiGetCH()/2-_STNS.fiGetEleHei(_STNS.fdmGetEleById(_STNS._aStMenus[_STNS._aStMenus.length-1].aPopups[0].sUid))/2),0)”

Posted in Tutorial Release | 2,193 Comments
Tags: , , ,

Older Entries
Newer Entries