Template:Team:Bielefeld/Head

From 2012.igem.org

(Difference between revisions)
Line 7: Line 7:
<div id="header">
<div id="header">
</div>
</div>
 +
 +
 +
 +
 +
<div id="navigation">
<div id="navigation">
 +
 +
<div style="margin-left:50px;">
 +
        <ul id="menu">
 +
            <li class="logo">
 +
                <img style="float:left;" alt="" src="menu_left.png"/>
 +
                <ul id="main">
 +
                    <li>Welcome to <b>Create Vimeo-like top navigation</b> tutorial!</li>
 +
                    <li class="last">
 +
                        <img class="corner_left" alt="" src="corner_blue_left.png"/>
 +
                        <img class="middle" alt="" src="dot_blue.png"/>
 +
                        <img class="corner_right" alt="" src="corner_blue_right.png"/>
 +
                    </li>
 +
                </ul>
 +
               
 +
            </li>
 +
            <li><a href="#">Login</a>
 +
            </li>
 +
            <li><a href="#">Help</a>
 +
                <ul id="help">
 +
                    <li>
 +
                        <img class="corner_inset_left" alt="" src="corner_inset_left.png"/>
 +
                        <a href="#">General help</a>
 +
                        <img class="corner_inset_right" alt="" src="corner_inset_right.png"/>
 +
                    </li>
 +
                    <li><a href="#">Posts</a></li>
 +
                    <li><a href="#">Pages</a></li>
 +
                    <li class="last">
 +
                        <img class="corner_left" alt="" src="corner_left.png"/>
 +
                        <img class="middle" alt="" src="dot.gif"/>
 +
                        <img class="corner_right" alt="" src="corner_right.png"/>
 +
                    </li>
 +
                </ul>
 +
            </li>
 +
            <li class="searchContainer">
 +
                <div>
 +
                <input type="text" id="searchField" />
 +
                <img src="magnifier.png" alt="Search" onclick="alert('You clicked on search button')" /></div>
 +
                <ul id="search">
 +
                    <li>
 +
                        <img class="corner_inset_left" alt="" src="corner_inset_left.png"/>
 +
                        <input id="cbxAll" type="checkbox" />All
 +
                        <img class="corner_inset_right" alt="" src="corner_inset_right.png"/>
 +
                    </li>
 +
                    <li><input id="Articles" type="checkbox" />Articles</li>
 +
                    <li><input id="Tutorials" type="checkbox" />Tutorials</li>
 +
                    <li><input id="Reviews" type="checkbox" />Reviews</li>
 +
                    <li><input id="Resources" type="checkbox" />Resources</li>
 +
                    <li class="last">
 +
                        <img class="corner_left" alt="" src="corner_left.png"/>
 +
                        <img class="middle" alt="" src="dot.gif"/>
 +
                        <img class="corner_right" alt="" src="corner_right.png"/>
 +
                    </li>
 +
                </ul>
 +
            </li>
 +
        </ul>
 +
        <img style="float:left;" alt="" src="menu_right.png"/>
 +
    </div>
 +
 +
 +
</div>
</div>

Revision as of 17:00, 21 August 2012