Skip to content

Instantly share code, notes, and snippets.

@toburger

toburger/dabblet.css

Forked from anonymous/dabblet.css
Created April 4, 2013 09:27
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save toburger/5309036 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save toburger/5309036 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. toburger revised this gist Apr 4, 2013. 1 changed file with 12 additions and 1 deletion.
    13 changes: 12 additions & 1 deletion dabblet.css
    View file
    Original file line number Diff line number Diff line change
    @@ -1,6 +1,17 @@
    /**
    * Simple CSS only flyout menu
    */

    body {
    background: #f06;
    background: linear-gradient(45deg, #f06, yellow);
    min-height: 100%;
    font-family: Arial;
    }
    nav {
    width: 100%;
    float: left;
    font-weight: bold;
    }
    nav ul {
    list-style: none;
    @@ -24,9 +35,9 @@ nav ul ul {
    }
    nav li li {
    float: none;
    padding: 5px 0px;
    }
    nav li:hover ul {
    display: block;
    transform: translate(0px,0px);
    opacity: 1;
    }
  2. @invalid-email-address Anonymous created this gist Apr 3, 2013.
    32 changes: 32 additions & 0 deletions dabblet.css
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,32 @@
    nav {
    width: 100%;
    float: left;
    }
    nav ul {
    list-style: none;
    padding: 0px;
    margin: 0px;
    }
    nav li {
    position: relative;
    float: left;
    padding: 5px;
    cursor: pointer;
    }
    nav ul ul {
    left: 0px;
    opacity: 0;
    transition-property: opacity, transform;
    transition-duration: 100ms, 100ms;
    transform: translate(0px,-10px);
    transition-timing-function: ease ease;
    transition-delay: 200ms;
    }
    nav li li {
    float: none;
    }
    nav li:hover ul {
    display: block;
    transform: translate(0px,0px);
    opacity: 1;
    }
    13 changes: 13 additions & 0 deletions dabblet.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,13 @@
    <!-- content to be placed inside <body>…</body> -->
    <nav>
    <ul>
    <li>Home</li>
    <li>To be expanded
    <ul>
    <li>Sub1</li>
    <li>Sub2</li>
    </ul>
    </li>
    <li>About</li>
    </ul>
    </nav>
    1 change: 1 addition & 0 deletions dabblet.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    // alert('Hello world!');
    1 change: 1 addition & 0 deletions settings.json
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    {"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}