Page 2 of 2

Re: bulletmenu generates wrong html ?

Posted: Thu Jun 02, 2005 5:10 pm
by ploc
wishy wrote: Well, this is the first time I actually got around to looking at the problem.  I actually haven't touched nils73's code yet...

So, that leads me back to: Am I losing my mind?  ;)
whishy, I don't think you're losing your mind. In fact, I think I've found an explanation...

In fact, I base the first post of this thread on the code generated by a demo version of cmsms (I can't remember if this is the demo cmsms website, or the one from opensourcecms.com) which is an old version of cmsms.

I think, the code had been corrected in en 0.9 or the 0.10 version...

Have you now found back your mind ? ;-)

Ploc

Edit : I've juste checked the demo version of cmsms website, the html code seems to be ok. I must have been smoke... (or the wrong html code came from opensourcecms.com...)

Anway, the last posts are still valid; but the firsts ones can be ignored I think...

Re: bulletmenu generates wrong html ?

Posted: Thu Jun 02, 2005 5:15 pm
by Ted
Yes, yes I have.  Thank you.  :)

So, at some point we need to clean up the html for bulletmenu, but that's not a showstopper.  That's good.

Re: bulletmenu generates wrong html ?

Posted: Thu Jun 02, 2005 11:03 pm
by iNSiPiD
Now I think I've lost my mind. :& :% :@ :* :~) [So how do you write a crazy faced smiley anyway??]

Re: bulletmenu generates wrong html ?

Posted: Fri Jun 03, 2005 11:52 am
by nils73
If you need any assistance from my side, let me know ...

Re: bulletmenu generates wrong html ?

Posted: Sun Jul 17, 2005 9:39 pm
by Greg
I recently purchased the book Stylin' with CSS by Charles Wyke-Smith to get a better understanding of CSS based menus.
There are many CSS based menu examples with with dropdown menus. Bulletmenu creates code that is close to what is needed but ....

If Bulletmenu could be changed to produce the code as per the book phplayers could be replaced.

The HTML code that needs to be created to use CSS dropdowns needs the following structure:

Code: Select all

<div id="listmenu">
 <ul>
  <li><a href="#">Customers</a>
     <ul><!-- drop down menu items -->
        <li><a href="#">Our Services</a></li>
        <li><a href="#">FAQs</a>
		  <ul><!-- pop-out menu items -->
            <li><a href="#">Products</a></li>
            <li><a href="#">Services</a></li>
			<li><a href="#">Store</a></li>
            <li><a href="#">Company</a></li>
            <li><a href="#">Careers</a></li>
          </ul>
		 </li>
        <li><a href="#">Sign Up</a></li>
        <li><a href="#">Support</a>
		  <ul> <!-- pop-out menu items -->
            <li><a href="#">Gold program</a></li>
            <li><a href="#">Silver program</a></li>
            <li><a href="#">Bronze program</a></li>
            <li><a href="#">Contact Us</a>
			  <ul> <!-- second level pop-out menu items -->
				<li><a href="#">West Coast</a></li>
				<li><a href="#">Mountain Region</a></li>
				<li><a href="#">Central Region</a></li>
				<li><a href="#">East Coast</a></li>
			  </ul>
			</li>
          </ul>
		</li>
		<li><a href="#">What's New</a></li>
      </ul>
  </li>
  <li><a href="#">Members</a>
  <ul>
        <!-- second level pop-out menu items-->
         <li><a href="#">Join</a></li>
         <li><a href="#">Log in</a></li>
         <li><a href="#">Meet others</a></li>
         <li><a href="#">Special Offers</a></li>
   	  </ul>
  </li>
  <li><a href="#">Dealers</a>
  <ul>
        <!-- second level pop-out menu items-->
         <li><a href="#">Special Pricing</a></li>
		 <li><a href="#">Orders</a></li>
         <li><a href="#">Update Listing</a></li>
         <li><a href="#">Events</a></li>
   	  </ul>
  </li>
  <li><a href="#">Distributors</a>
      <ul>
        <!-- drop down menu items-->
        <li><a href="#">Products</a></li>
        <li><a href="#">Dealer Finder</a>
		<ul>
        <!-- pop-out menu items-->
         <li><a href="#">West Coast</a></li>
         <li><a href="#">Mountain Region</a>
		 <ul>
        <!-- second level pop-out menu items-->
         <li><a href="#">North</a></li>
         <li><a href="#">South</a></li>
         <li><a href="#">East</a></li>
         <li><a href="#">West</a></li>
      	</ul>
		</li>
         <li><a href="#">Central Region</a></li>
         <li><a href="#">East Coast</a></li>
      	</ul>
	  </li>
        <li><a href="#">Commissions</a></li>
        <li><a href="#">Customers</a></li>
      </ul></li>
  </ul>
</div>

Re: bulletmenu generates wrong html ?

Posted: Sun Jul 17, 2005 9:55 pm
by Greg
The above template actually creates 4 levels and to add another level is not difficult.

The HTML and CSS code etc. that goes with the book is here

The code I quoted with the css is in chapter 7  (listing fig7.28.htm)... take a look Patricia.

Re: bulletmenu generates wrong html ?

Posted: Sun Jul 17, 2005 11:57 pm
by Ted
Well, I started a CSSMenu module this afternoon.  Sort of a weird conincidence that you posted this around the same time.

Anyway, my first point of business was taking the bulletmenu code and making it more sane.  This is done, and it's suprirsingly similar to your code above.  So...  I guess the next step would be to use the css in that link.  Better check licenses first...

Re: bulletmenu generates wrong html ?

Posted: Mon Jul 18, 2005 1:17 am
by Ted
Ok, I'm gonna need some help.  If anyone wants to hand feed me some CSS for a vertical and horizontal menu that flies out it's children, I would be most appreciative.

This is the kind of stuff that's too frustrating me for me.

Here is the output of the module so far...

Code: Select all

<div id="menu">

<ul>
<li><a href="http://localhost/cms/index.php?page=cms-install-successful-" class="currentpage">Home Page</a>
<ul>
<li class="sectionheader"><h2>FAQ</h2>
<ul>
<li><a href="http://localhost/cms/index.php?page=contact-us">Contact Us</a>
</li>
</ul>
</li>
<li class="separator"><a href="#"></a></li>
<li><a href="http://localhost/cms/index.php?page=svn-cvs-">SVN (cvs)</a>

</li>
</ul>
</li>
<li><a href="http://localhost/cms/index.php?page=Uploads">Uploads</a></li>
<li><a href="http://localhost/cms/index.php?page=Test">Test</a></li></ul></div>

</div>
Thanks!

Re: bulletmenu generates wrong html ?

Posted: Mon Jul 18, 2005 3:25 am
by Greg
Looks like you are on the right track wishy. I used the css from the above chapter 7  (listing fig7.28.htm) and it produces a 3 item menu on the top bar a dropdown with two subitems uder the home page menu and a pop-out from the FAQ subitem.

Re: bulletmenu generates wrong html ?

Posted: Mon Jul 18, 2005 10:05 am
by Ted
Is there anything in that book for a vertical version?

Re: bulletmenu generates wrong html ?

Posted: Mon Jul 18, 2005 12:40 pm
by Greg
Nothing in the book, but if you remove the first float:left statement in the div#listmenu CSS you get a vertical menu.
I have it running with a vertical menu on my local set-up.  The CSS actually works with Bulletmenu as it was with IE but Firefox insists on the above code.
(So late in replying because my 19" acer monitor died !)

Re: bulletmenu generates wrong html ?

Posted: Mon Jul 18, 2005 4:23 pm
by Ted
Hmm.  I'll have to see your example.  It looks like a jumbled mess to me...  Maybe I'm missing something, but the flyouts are going down instead of over to the right.  Probably just me being lazy.

Re: bulletmenu generates wrong html ?

Posted: Tue Jul 19, 2005 1:42 am
by Greg
Another method that has a wee tiny bit of javascript for IE is Here
wishy I sent you a pm with more info on the above CSSMenu.

Re: bulletmenu generates wrong html ?

Posted: Wed Jul 27, 2005 1:03 am
by iNSiPiD
I've just discovered that the number_of_levels parameter treats 0 as no menu display.

So 4 will show 3 levels deep.

NOt really a big, just something I noticed.

NB: For anyone who'd like to see what bulletmenu and cross-broswer CSS can do to 3 levels, please visit my new almost-launched oranisation's website here:

http://d81314.i50.quadrahosting.com.au/ ... blications

Comments welcome.

Please note that NO client-side scripting or tricks have been used.

Unfortunately I can't see a way to get flyouts to work without JS. :(