Separator Images

Post by **marty** » Mon Jul 05, 2004 12:56 pm

Separator images can make a huge difference to the style of your menu, their size and alignment are completely adjustable to compliment your design.

If you have any requests for particular separator images, post them here and we may just have what you're after.

-Marty

Post by **marty** » Mon Jul 05, 2004 1:01 pm

Cubes

rudy · Post by **rudy** » Thu Jul 15, 2004 8:38 pm

Any chance to see a URL with "Cubes" in action in a menu?

marty wrote:Cubes

Post by **John** » Thu Jul 15, 2004 8:55 pm

Sure. Just save the image to your machine, then call its name as separatorimage="cube_sep.gif"; (or whatever you choose to call it).

fredlongworthhighschool · Mon Jul 26, 2004 3:43 pm

Hmmm. When I try that I get the image but really thin so you can only see the tops of the boxes.

Post by **John** » Mon Jul 26, 2004 9:01 pm

Andy, does the image look OK in Fireworks or Photoshop (whatever), or is it just bad in the menu?

Post by **marty** » Mon Jul 26, 2004 9:28 pm

I've used this image before in examples and it's fine, perhaps you just need to adjust the separatorheight?

-Marty

fredlongworthhighschool · Tue Jul 27, 2004 11:27 am

I've tried up to a height of 80 but it doesn't seem to be making a difference.

Can you post a line of code which you've used?

Post by **John** » Tue Jul 27, 2004 2:41 pm

80 may have been overkill, Andy, given it's only a 5px graphic.

Post by **John** » Tue Jul 27, 2004 2:59 pm

Hmmm - scratch that. I can't get it to show at all...

Post by **marty** » Tue Jul 27, 2004 3:31 pm

http://milonic.com/forumimages/test/cubes_menu

I think the separatorsize is 5 but don't quote me on that!

-Marty

Post by **Ruth** » Tue Jul 27, 2004 3:31 pm

It only seems to show in a vertical menu. If you decrease the size it cuts off part of the image, if you increase it, I tried 10, it doubled the image rather than increasing the image size.

Ruth

Post by **marty** » Tue Jul 27, 2004 3:34 pm

Hi Ruth,

You'll need to use a vertical image for a horizontal menu as the menu isn't quite clever enough yet to change the orientation etc.

-Marty

Post by **marty** » Tue Jul 27, 2004 3:45 pm

This one should do the trick, depending what sort of gap you want inbetween.

-Marty

Post by **John** » Tue Jul 27, 2004 3:50 pm

I still can't get it to show at all, and I don't really see anything different in our code. 5 is correct, Marty.

Thanks.

fredlongworthhighschool · Wed Jul 28, 2004 8:55 am

What's not helping me is that we have just moved to a new intranet server and the changes aren't showing as quickly as they were before.

So, you make a change and don't see a difference, and end up changing it again before it's had time to activiate!

webdragon · Post by **webdragon** » Tue Dec 28, 2004 10:33 am

Hi everyone, its me again!

This time I am stuck on putting a separator image in my menu.

When I put separatorimage=img_separator.gif then it doesn't display.

I have tried to mess around with the height and width settings but haven't had any luck. I even copyed it to the same folder as the menu, but nothing.

Please could you have a look and see if I'm doing something stupid?

Thanks!

This is one of the styles in my menu_data.js

Code: Select all


with(subNavStyle=new mm_style()){
onbgcolor="#F8F9FA";
oncolor="#3DC900";
offbgcolor="#FFFFFF";
offcolor="#0066B3";
separatorcolor="#DCDCDC";
separatorsize="1";
separatorwidth=190;
separatorheight=25;
separatorimage="img_separator.gif";
padding=2;
fontsize="10px";
fontweight="bold";
fontfamily="Verdana, Arial, Tahoma, Sans-Serif";
}

This is my submenufile:

Code: Select all

<script type="text/javascript">
								with(milonic=new menuname("mission")){
								style=subNavStyle;
								alwaysvisible=1;
								orientation="vertical";
								position="relative";
								aI("text=Mission Leadership;url=missionLeadership.asp;image=images/img_blueArrow.gif;overimage=images/img_greenArrow.gif;itemheight=30px;");
								aI("text=Behaviours;url=behaviours.asp;image=images/img_blueArrow_sub.gif;offcolor=#0066B3;offbgcolor=#FFFFFF;pagecolor=#E8710F;headerbgcolor=#FFFFFF;headercolor=#F8F9FA;pagecolor=#F8F9FA;itemheight=30px;");
								aI("text=Process;url=process.asp;image=images/img_blueArrow_sub.gif;offcolor=#0066B3;offbgcolor=#FFFFFF;pagecolor=#F8F9FA;headerbgcolor=FFFFFF;headercolor=#F8F9FA;pagecolor=#FFFFFF;itemwidth=190px;itemheight=30px;");
								aI("text=Performance;url=performance.asp;image=images/img_blueArrow_sub.gif;offcolor=#0066B3;offbgcolor=#FFFFFF;pagecolor=#F8F9FA;headerbgcolor=#F8F9FA;headercolor=#E8710F;pagecolor=#F8F9FA;itemwidth=190px;itemheight=30px;pageborder=1px dashed #ffffff;");
								}
								drawMenus(); // Then draw the second sub menu.
</script>

Milonic JavaScript Menu

Separator Images

Separator Images

Separator Image not showing up