Make WordPress Core

Ticket #29979: 29979.5.diff

File 29979.5.diff, 3.5 KB (added by iamtakashi, 10 years ago)
  • wp-content/themes/twentyfifteen/js/functions.js

     
    66 */
    77
    88( function( $ ) {
     9        'use strict';
     10
    911        $( 'html' ).removeClass( 'no-js' );
    1012
    1113        // Add dropdown toggle that display child menu items.
     
    4749                        $( this ).toggleClass( 'toggled-on' );
    4850                } );
    4951        } )();
    50 } )( jQuery );
    51  No newline at end of file
     52
     53        // Sidebar scrolling.
     54
     55        $( function() {
     56                var     $window = $( window ),
     57                        lastWindowPos = 0,
     58                        $document = $( document ),
     59                        $adminbar = $( '#wpadminbar' ),
     60                        $sidebar = $( '#sidebar' ),
     61                        top = false,
     62                        bottom = false,
     63                        windowWidth, windowHeight, documentHeight,
     64                        adminBarHeight, sidebarWidth, sidebarHeight,
     65                        resizeTimer;
     66
     67                function resize() {
     68                        windowWidth = $window.width();
     69                        windowHeight = $window.height();
     70                        documentHeight = $document.height();
     71                        adminBarHeight = $adminbar.height();
     72                        sidebarWidth = $sidebar.width();
     73                        sidebarHeight = $sidebar.height();
     74
     75                        if ( sidebarWidth === windowWidth ) {
     76                                top = bottom = false;
     77                                $sidebar.removeAttr( 'style' );
     78                        }
     79                }
     80
     81                function scroll() {
     82                        var windowPos = $window.scrollTop();
     83
     84                        if ( sidebarWidth < windowWidth && sidebarHeight + adminBarHeight < documentHeight ) {
     85                                if ( sidebarHeight + adminBarHeight > windowHeight ) {
     86                                        if ( windowPos > lastWindowPos ) {
     87                                                if ( top ) {
     88                                                        top = false;
     89                                                        $sidebar.attr( 'style', 'top: ' + $sidebar.offset().top + 'px;' );
     90                                                } else if ( ! bottom && windowPos + windowHeight > sidebarHeight + $sidebar.offset().top ) {
     91                                                        bottom = true;
     92                                                        $sidebar.attr( 'style', 'position: fixed;bottom: 0;' );
     93                                                }
     94                                        } else if ( windowPos < lastWindowPos ) {
     95                                                if ( bottom ) {
     96                                                        bottom = false;
     97                                                        $sidebar.attr( 'style', 'top: ' + $sidebar.offset().top + 'px;' );
     98                                                } else if ( ! top && windowPos + adminBarHeight < $sidebar.offset().top ) {
     99                                                        top = true;
     100                                                        $sidebar.attr( 'style', 'position: fixed;' );
     101                                                }
     102                                        } else {
     103                                                top = bottom = false;
     104                                                $sidebar.attr( 'style', 'top: ' + $sidebar.offset().top + 'px;' );
     105                                        }
     106                                } else if ( ! top ) {
     107                                        top = true;
     108                                        $sidebar.attr( 'style', 'position: fixed;' );
     109                                }
     110                        }
     111
     112                        lastWindowPos = windowPos;
     113                }
     114
     115                function resizeAndScroll() {
     116                        resize();
     117                        scroll();
     118                }
     119
     120                $window
     121                        .on( 'scroll.pin-sidebar', scroll )
     122                        .on( 'resize.pin-sideabr', function() {
     123                                clearTimeout( resizeTimer );
     124                                resizeTimer = setTimeout( resizeAndScroll, 200 );
     125                        } );
     126
     127                resizeAndScroll();
     128
     129                for ( var i = 1; i < 6; i++ ) {
     130                        setTimeout( resizeAndScroll, 500 * i );
     131                }
     132        } );
     133} )( jQuery );
  • wp-content/themes/twentyfifteen/style.css

     
    38353835
    38363836        .sidebar {
    38373837                float: left;
    3838                 height: 100%;
    38393838                margin-right: -100%;
    38403839                max-width: 413px;
    3841                 overflow-y: scroll;
    3842                 -webkit-overflow-scrolling: touch; /* Enable momentum scrolling on iOS Safari */
    3843                 position: fixed;
     3840                position: absolute;
    38443841                width: 29.4118%;
    38453842        }
    38463843
    3847         .admin-bar .sidebar {
    3848                 height: -webkit-calc(100% - 32px);
    3849                 height: calc(100% - 32px);
    3850         }
    3851 
    38523844        .secondary {
    38533845                background-color: transparent;
    38543846                display: block;