Page 2 of 3 FirstFirst 123 LastLast
Results 11 to 20 of 25

Thread: Assistance with the BLM MultiLevel Effect Menu

  1. #11
    Join Date
    Sep 2005
    Posts
    882
    Thanks
    0
    Thanked 3 Times in 3 Posts

    Default

    Ok, found at least one small error. In your CSS file
    Code:
    	.bluewhite li a{
    			background-color: a1b4b4;
    			color: #000033;
    			border-color: #000033;
    		}
    should be
    Code:
    	.bluewhite li a{
    			background-color: #a1b4b4;
    			color: #000033;
    			border-color: #000033;
    		}
    Also, your page is using a transitional doctype. I have tested the menu under a strict doctype.

    Have you made any other changes to the default CSS(besides the color)? Somewhere there is a lot of padding getting added, but don't see where.

  2. #12
    Join Date
    Oct 2006
    Posts
    26
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    thanks Brady - but the color is working. It is the overall horizontal menu size that I can not get to fit in the table? any ideas how to fix this?

  3. #13
    Join Date
    Sep 2005
    Posts
    882
    Thanks
    0
    Thanked 3 Times in 3 Posts

    Default

    The color doesn't work when you switch to a strict doc type.

    Anyway, if you compare your menu to the demos you will notice that your menus are a different size. I think the problems are related. That is why I was asking if you had made any changes.And you still haven't aswered the question of which version you are using. You seem to be using the HTML of one and the CSS of the other.

  4. #14
    Join Date
    Oct 2006
    Posts
    26
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by blm126
    The color doesn't work when you switch to a strict doc type.

    Anyway, if you compare your menu to the demos you will notice that your menus are a different size. I think the problems are related. That is why I was asking if you had made any changes.And you still haven't aswered the question of which version you are using. You seem to be using the HTML of one and the CSS of the other.
    OK -
    1) I added the missing "#" as you found I was missing to the css file and uploaded it with the change made.

    2) I know my menu is a different size then the ones in the demos. I have changed the colors to match my site and as we have been discussing, I am trying to fit your script into the frames of my website. I LOVE the script and have no complaints with it, but just can not get it to fit completely from left to right in the table I have inserted it into. And as you can see in Firfox, now it wraps down to 2 lines. And in IE there is a space to the far left between the far right edge of the menu and the right border of the table it is in.

    3) In the "read me" file from the version I used it says the following - "Multi-Level Effect Menu v1.1 by Brady Mulhollem"

    Brady, I hope there is some fix for this. I hate asking you, but I am stuck and it has to work in IE. Wether I hate IE or not is irrelebant - the majority of the normal web viewing world still uses it, so I have to make it work in IE also.

    Thanks again for the help

  5. #15
    Join Date
    Sep 2005
    Posts
    882
    Thanks
    0
    Thanked 3 Times in 3 Posts

    Default

    Well, I know what the width problem is now...I know you changed the width of each link, but do you happen to design this for IE? This is IE's box model coming into play. Redo the width of the links to work in Firefox, then use conditional comments to supply the width that will work in IE.

  6. #16
    Join Date
    Oct 2006
    Posts
    26
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by blm126
    Well, I know what the width problem is now...I know you changed the width of each link, but do you happen to design this for IE? This is IE's box model coming into play. Redo the width of the links to work in Firefox, then use conditional comments to supply the width that will work in IE.
    Brady, I GREATLY appreciate your continued assistance and help with your script. I hate to sound "dumb" but can you assist me with the "conditional comments to supply the width that will work in IE.
    When I get home tonight I will do what you said and redoe the width pixel size to fit horizontally in FireFox. After that I will need assistance with what the conditional comments are and where to put them in the css file.

    Can you assist me with this please.

  7. #17
    Join Date
    Sep 2005
    Posts
    882
    Thanks
    0
    Thanked 3 Times in 3 Posts

    Default

    Sure, read up a little on them here.
    And not for the brief tour. Just add
    Code:
    <!--[if IE]>
    <script type="text/css">
    #menu a{
    width: 84px;
    }
    </script>
    <![endif]-->
    I haven't tested that width by the way(just a guess). Also, you will need to apply an id of "menu" to the container div.

  8. #18
    Join Date
    Oct 2006
    Posts
    26
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi Brady; It is still not working. Am I missing anything. Here is what I did, following your instructions -

    1) First I adjusted the width so the menu fits in Firefox. Then I added the additional code you told me to at the end of the css file. But no matter what I change the new code at the end to it does not allow me change way it looks in IE. The new code for that part looks like this:

    Code:
    .horizontal ul li a{
    			display: block;
    			width: 85px;
    			text-decoration: none;
    			height: 1.5em;
    			padding: .1em 1px;
    			overflow: hidden;
    			border: 1px solid;
    			border-left: none;
    		}
    		.horizontal li li{
    			float: none;
    			border-bottom: 1px solid transparent;
    			margin-bottom: -1px;
    		}
    		.horizontal li li.last{
    			border-bottom: none;
    		}
    		.horizontal ul li ul{
    			position: absolute;
    			top: 1.3em;
    			left: -1px;
    			margin-top: -1px;
    		}
    		.horizontal ul ul ul{
    			width: 230px;
    			top: -1px;
    			left: 128px;
    			margin-top: 0;
    		}
    		.horizontal.left ul ul ul,.horizontal .left ul ul{
    			top: -1px;
    			left: -128px;
    		}
    		.horizontal ul li li a{
    			border: 1px solid;
    			border-top: none;
    		}
    		.horizontal ul li:first-child>a{
    			border-left: 1px solid;
    		}
    		.horizontal ul li a.first{
    			border-left: 1px solid;
    		}
    		.horizontal ul li li a.first{
    			border-top: 1px solid;
    		}
    		.horizontal ul li li:first-child>a{
    			border-top: 1px solid;
    		}
    		div.horizontal ul li.pixelfix ul{
    			left: 0;
    		}
    		div.horizontal ul li.pixelfix ul ul{
    			left: 128px;
    		}
    		/*here we use a little CSS to make a basic/backup dropdown menu in modern browsers *cough* not IE6 or less *cough* if javascript is disabled.Flickering never happens in these browsers*/
    		.mlmenu li ul{
    			display: none;
    		}
    		.mlmenu li:hover>ul{
    			display: block;
    		}
    		/*This section makes the menu not work in non-javascript enabled browsers by not showing the menu by default-This can be worked around by making top level links point to a sitemap*/
    		.accessible li ul{
    			display: block;
    		}
    		/*Code to show an element has a child*/
    		.mlmenu.plus li a:first-child:not(:last-child):after{
    			content: '+';
    		}
    		.plus a span{
    			padding-left: .5em;
    		}
    		.noshow{
    			visibility: hidden;
    		}
    		/*colors for menu*/
    		.blackwhite li a{
    			background-color: white;
    			color: black;
    			border-color: black;
    		}
    		.blackwhite li a:hover,.blackwhite li a.first:hover,.blackwhite .trail a.hover{
    			background-color: black;
    			color: white;
    			border-color: black;
    		}
    		.blackwhite li:first-child>a:hover{
    			background-color: black;
    			color: white;
    			border-color: black;
    		}
    		.blackwhite ul{
    			border-color: black;
    		}
    		.bluewhite li a{
    			background-color: #a1b4b4;
    			color: #000033;
    			border-color: #000033;
    		}
    		.bluewhite li a:hover,.bluewhite li a.first:hover,.bluewhite .trail a.hover{
    			background-color: #000033;
    			color: white;
    			border-color: #000033;
    		}
    		.bluewhite li:first-child>a:hover{
    			background-color: #000033;
    			color: white;
    			border-color: #000033;
    		}
    		.bluewhite ul{
    			border-color: #000033;
    		}
    		<!--[if IE]>
                             <script type="text/css">
                             #menu a{
                             width: 88px;
                             }
                            </script>
                            <![endif]-->

  9. #19
    Join Date
    Oct 2006
    Posts
    26
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    anything new to help?
    anyone else?


  10. #20
    Join Date
    Sep 2005
    Posts
    882
    Thanks
    0
    Thanked 3 Times in 3 Posts

    Default

    Sorry, I was away from my computer for a couple days. The conditional comment needs to go in the <head> tag of the file. Not in the css file.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •