Sliding doors drop-down menu

Permalink April 08, 2010 at 5:47 AM

I have a template which I've created from scratch and it has a sliding doors navigation with images for each state and a sub menu, much like the one in this tutorial:
http://www.cssplay.co.uk/menus/doors_drop_line_three.html...

Is there a template out there which I could take the code from so I can integrate this with Concrete CMS?
Or can anyone help me with how to do this?

Current code:

<div id="nav">
            <ul>
                <li id="homeactive"><span>Home</span></li>
                <li id="about"><a href="about.html"><span>About us</span><!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
                    <ul>
                        <li><a href="#">Why Choose Us</a></li>
                        <li><a href="#">Structure and Sessions</a></li>
                        <li><a href="#">Tax Credits</a></li>
                        <li><a href="#">Careers</a></li>
                    </ul>
                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                </li>
                <li id="nurseries"><a href="nurseries.html"><span>Nurseries</span><!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->

Viewing 15 lines of 42 lines. View entire code block.

 
    <div id="nav">
            <ul>
                <li id="homeactive"><span>Home</span></li>
                <li id="about"><a href="about.html"><span>About us</span><!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
                    <ul>
                        <li><a href="#">Why Choose Us</a></li>
                        <li><a href="#">Structure and Sessions</a></li>
                        <li><a href="#">Tax Credits</a></li>
                        <li><a href="#">Careers</a></li>
                    </ul>
                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                </li>
                <li id="nurseries"><a href="nurseries.html"><span>Nurseries</span><!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
                    <ul>
                        <li><a href="#">Choose a Nursery</a></li>
                        <li><a href="#">Nutrition</a></li>
                        <li><a href="#">A Typical Day</a></li>
                        <li><a href="#">Our Staff</a></li>
                    </ul>
                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                </li>
                <li id="gallery"><a href="gallery.html"><span>Gallery</span></a></li>
                <li id="links"><a href="links.html"><span>Links</span><!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
                    <ul>
                        <li><a href="#">Parental Support</a></li>
                        <li><a href="#">Government Related Links</a></li>
                    </ul>
                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                </li>
                <li id="contact"><a href="contact.html"><span>Contact</span><!--[if IE 7]><!--></a><!--<![endif]-->
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
                    <ul>
                        <li><a href="#">Contact Head Office</a></li>
                        <li><a href="#">Download Parent Pack</a></li>
                    </ul>
                    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
                </li>
            </ul>
    </div>

Forums

Editing (v7+)

Sliding doors drop-down menu

Code

Post Reply

Delete Post

Mark Post as Spam

Destroy Spammer

Sign In?