WordPress.org
Get WordPress

Plugin Directory

Changeset 1021707


Ignore:
Timestamp:
11/07/2014 09:00:15 PM (11 years ago)
Author:
jasonmj
Message:

Added Support for Menus too tall for the window

Location:
auto-collapse/trunk
Files:
3 edited

Legend:

Unmodified
Added
Removed

  • auto-collapse/trunk/auto-collapse.js

    r1012797 r1021707  
     1// WP Admin Sidebar Collapse
    12jQuery(document).ready(function($) {
    23   
    3     $("#adminmenuwrap").mouseenter(function() {
     4    // Define the functions
     5    $adminMenuWrap = $('#adminmenuwrap');
     6    var collapseIt = function($adminMenuWrap) {
     7        if ( !$(document.body).hasClass('folded') ) {
     8           
     9            $("#collapse-menu").trigger('click');
     10            $(document.body).toggleClass('expanded');
     11            $adminMenuWrap.removeClass('floating');
     12            $adminMenuWrap.css({'margin-top':'0px'});
    413       
     14        }
     15    };
     16   
     17    var expandIt = function($adminMenuWrap) {
     18        adminMenuWrap = $('#adminmenuwrap');
    519        if ( $(document.body).hasClass('folded') ) {
    620           
    721            $("#collapse-menu").trigger('click');
    8        
     22            $(document.body).toggleClass('expanded');
     23            if ( $(window).height() > $adminMenuWrap.height() + 28 ) {
     24                $adminMenuWrap.toggleClass('floating');
     25            } else {
     26                $('.expanded #adminmenuwrap').css({'margin-top':$(window).scrollTop()});
     27            }
     28           
    929        }
    1030       
    11     });
     31    }
    1232   
    13     $("#wpbody").mouseover(function() {
    14        
    15         if ( !$(document.body).hasClass('folded') ) {
    16            
    17             $("#collapse-menu").trigger('click');
    18        
     33    // Here's where the action is
     34    collapseIt($adminMenuWrap);
     35    $('#adminmenuwrap, #adminmenuback').hover(function() { expandIt($adminMenuWrap); });
     36    $('#wpcontent').mouseenter(function() { collapseIt($adminMenuWrap); });
     37   
     38    // Fancy footwork for menus that don't fit the window height
     39    var OldPos = 0;
     40    $(window).scroll(function() {
     41        if ( $(window).height() < $(this).height() + 28 ) {
     42            var NewPos = $(this).scrollTop();
     43            if ( NewPos < OldPos && $adminMenuWrap.offset().top > NewPos + 28 ) { // Scrolling Up Above Wrap
     44                $('.expanded #adminmenuwrap').css({'margin-top':NewPos});
     45            }
     46            if ( NewPos < OldPos && $adminMenuWrap.offset().top < NewPos + 28 ) { // Scrolling Up Below Wrap
     47                adminMenuWrap.removeClass('floating');
     48            }
     49            if ( NewPos > OldPos && $adminMenuWrap.offset().top < NewPos + 28) { // Scrolling Down Below Wrap
     50                adminMenuWrap.removeClass('floating');
     51            }
     52            if ( NewPos > OldPos && $adminMenuWrap.offset().top > NewPos + 28 ) { // Scrolling Down Above Wrap
     53                adminMenuWrap.removeClass('floating');
     54                $('.expanded #adminmenuwrap').css({'margin-top':$(window).scrollTop()});
     55            }
     56            OldPos = NewPos;
    1957        }
    20        
    2158    });
    2259   
    2360});
    2461
     62// Customizer Collapse
    2563jQuery(document).ready(function($) {
    2664   

  • auto-collapse/trunk/auto-collapse.php

    r1018985 r1021707  
    33 * Plugin Name: Auto Collapse
    44 * Description: A simple script to auto collapse the admin sidebar.
    5  * Version: 1.1.1
     5 * Version: 1.1.2
    66 * Author: FullSteam Labs
    77 */

  • auto-collapse/trunk/style.css

    r1018985 r1021707  
     1.expanded #adminmenuback  {background: rgba(0,0,0,0.8);}
     2#adminmenu .wp-has-current-submenu .wp-submenu, #adminmenu .wp-has-current-submenu .wp-submenu.sub-open {background: rgba(90, 90, 90, 0.5);}
     3#adminmenu li.menu-top:hover, #adminmenu li.opensub > a.menu-top, #adminmenu li > a.menu-top:focus {background: rgba(0,0,0,0.25);}
     4#adminmenu .wp-submenu {background: rgba(0,0,0,0.75);}
    15#adminmenu, #adminmenu .wp-submenu, #adminmenuback, #adminmenuwrap {
    2     transition: all 200ms linear;
    3     position: absolute;
    4     opacity: 0.96;
     6    transition: width 200ms linear;
    57    z-index: 10000 !important;
     8    overflow-x: visible;
    69}
     10#adminmenuwrap.floating {position: fixed;}
     11#adminmenuwrap {background: transparent; position: absolute;}
     12.folded #adminmenuwrap {position: fixed;}
    713ul#adminmenu {background: transparent;}
    814#wpcontent, #wpfooter { margin-left: 36px !important; }
    915.folded #wpcontent, .folded #wpfooter { margin-left: auto; }
    1016.folded #adminmenu, .folded #adminmenu .wp-submenu, .folded #adminmenuback, .folded #adminmenuwrap {
    11     transition: all 100ms 0ms linear;
    12     overflow-x: hidden;
    13     position: fixed;
     17    transition: width 100ms 0ms linear;
     18    overflow: hidden;
    1419    z-index: 10000 !important;
     20    height: auto;
    1521}
    1622.folded #adminmenu .wp-submenu {transition: all 0ms 0ms linear !important; display: none;}
Note: See TracChangeset for help on using the changeset viewer.