logo-dw

Go Back   Dreamweaver Club Forums > Dreamweaver forums > Spry
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 06-09-2016, 07:40 PM   #11
erru9107
 
Join Date: Mar 2016
Posts: 10
Default

Yeah, I've been thinking about changing the menu bar. Unfortunately it's not up to me since I'm creating the website for my girlfriend and she's very specific with how she wants the site to look.

Maybe you know of any other menu that would look like the one I already have but work better? I can't find any that she's happy enough with :/
erru9107 is offline   Reply With Quote
Old 06-10-2016, 01:23 AM   #12
edbr
edbr's Avatar
 
Join Date: Aug 2005
Location: Bali
Posts: 11,164
Default

we know our place right?
well from the images it looks like a drop down which can easily be done using just css or if you want animated drop downs use jquery. there are lots of free examples , styling to look like you have is just achieved with css syles,
ie.
http://cssmenumaker.com/css-drop-down-menu for css

and on the same site for jquery
http://cssmenumaker.com/menu/animate...drop-down-menu

but a search will show more.
__________________
If you're happy and you know it shake your meds!
different style links examples

Flight / Hotel search
Free script download
Bali Villas
edbr is offline   Reply With Quote
Old 06-10-2016, 01:24 AM   #13
edbr
edbr's Avatar
 
Join Date: Aug 2005
Location: Bali
Posts: 11,164
Default

ah just realised that might be a pay for site (not free. but there are many that are
__________________
If you're happy and you know it shake your meds!
different style links examples

Flight / Hotel search
Free script download
Bali Villas
edbr is offline   Reply With Quote
Old 06-10-2016, 01:25 AM   #14
edbr
edbr's Avatar
 
Join Date: Aug 2005
Location: Bali
Posts: 11,164
Default

do you have sub menus or 2 sub menus?
__________________
If you're happy and you know it shake your meds!
different style links examples

Flight / Hotel search
Free script download
Bali Villas
edbr is offline   Reply With Quote
Old 06-10-2016, 02:30 AM   #15
edbr
edbr's Avatar
 
Join Date: Aug 2005
Location: Bali
Posts: 11,164
Default

here try this (not responsive though.
Code:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>

<style>
#nav
{ width: 1200px;
	position:relative;
	display:inline-block;		
		background:#FFFF99;}

#nav ul
{	width: 800px;
list-style:none;
	position:relative;
	margin-left:auto; margin-right:auto;
	padding:0;
	}

#nav ul a
{
	display:block;
	color:#333;
	text-decoration:none;
	font-weight:700;
	font-size:12px;
	line-height:32px;
	padding:0 15px;
	font-family:"HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif
}

#nav ul li
{ background:#DAEC93;
	position:relative;
	float:left;
	margin:0;
	padding:0
}

#nav ul li.current-menu-item
{
	background:#ddd
}

#nav ul li:hover
{
	background:#f6f6f6
}

#nav ul ul
{
	display:none;
	position:absolute;
	top:100%;
	left:0;
	background:#fff;
	padding:0
}

#nav ul ul li
{
	float:none;
	width:200px
}

#nav ul ul a
{
	line-height:120%;
	padding:10px 15px
}

#nav ul ul ul
{
	top:0;
	left:100%
}

#nav ul li:hover > ul
{
	display:block
}


</style>
</head>

<body>

<nav id="nav">
<ul>
  <li class="current-menu-item"><a href="#">Home</a></li>
  <li><a href="#">Menu 1</a>
    <ul>
      <li><a href="#">Sub Menu 1</a></li>
      <li><a href="#">Sub Menu 2</a></li>
      <li><a href="#">Sub Menu 3</a></li>
      <li><a href="#">Sub Menu 4</a>
        <ul>
          <li><a href="#">Deep Menu 1</a>
            <ul>
              <li><a href="#">sub sub 1</a></li>
              <li><a href="#">sub sub 2</a></li>
              <li><a href="#">sub sub 3</a></li>
                <li><a href="#">sub sub 4</a></li>
            </ul>
          </li>
          <li><a href="#">Deep Menu 2</a></li>
        </ul>
      </li>
      <li><a href="#">Sub Menu 5</a></li>
    </ul>
  </li>
  <li><a href="#">Menu 2</a>
    <ul>
      <li><a href="#">Sub Menu 1</a></li>
      <li><a href="#">Sub Menu 2</a></li>
      <li><a href="#">Sub Menu 3</a></li>
    </ul>
  </li>
  <li><a href="#">Menu 3</a>
    <ul>
      <li class="dir"><a href="#">Sub Menu 1</a></li>
      <li class="dir"><a href="#">Sub Menu 2 </a>
        <ul>
          <li><a href="#">Category 1</a></li>
          <li><a href="#">Category 2</a></li>
          <li><a href="#">Category 3</a></li>
          <li><a href="#">Category 4</a></li>
          <li><a href="#">Category 5</a></li>
        </ul>
      </li>
      <li><a href="#">Sub Menu 3</a></li>
      <li><a href="#">Sub Menu 4</a></li>
      <li><a href="#">Sub Menu 5</a></li>
    </ul>
  </li>
  <li><a href="#">Menu 4</a></li>
  <li><a href="#">Menu 5</a></li>
  <li><a href="#">Menu 6</a></li>
  <li><a href="#">Contact Us</a></li>
</ul>
</nav>
</body>
</html>
__________________
If you're happy and you know it shake your meds!
different style links examples

Flight / Hotel search
Free script download
Bali Villas
edbr is offline   Reply With Quote
Old 06-11-2016, 09:36 PM   #16
erru9107
 
Join Date: Mar 2016
Posts: 10
Default

I've got only one level sub menu.

I'll try your code tomorrow and see how it looks! But just by looking through it, it seems like it should work fine. Will get back to you after I've tried it!

Thanks for all your help, I really appreciate it! Helps to keep me out of trouble with the misses
erru9107 is offline   Reply With Quote
Old 06-13-2016, 10:16 AM   #17
erru9107
 
Join Date: Mar 2016
Posts: 10
Default

I just tried it out and it seems to work! Only done some minor testing tho so if I run into any more issues, I'll just make another post here.

In the meantime, thank you very much!
erru9107 is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 11:20 PM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com