Create New Item
Item Type
File
Folder
Item Name
Search file in folder and subfolders...
Are you sure want to rename?
File Manager
/
wp-content
/
plugins
/
sneeit-framework
/
js
:
front-sticky-columns.js
Advanced Search
Upload
New Item
Settings
Back
Back Up
Advanced Editor
Save
(function ($) { if (typeof(Sneeit_Sticky_Columns) == 'undefined' || !Sneeit_Sticky_Columns || $(Sneeit_Sticky_Columns).length == 0) { return; } // Clone a fake column var SSC_Index = 0; if (typeof(Sneeit_Sticky_Columns) != 'string' && typeof(Sneeit_Sticky_Columns) != 'String') { Sneeit_Sticky_Columns = Sneeit_Sticky_Columns.join(','); } $(Sneeit_Sticky_Columns).each(function(){ var display = $(this).css('display'); // this is a hidden column if (typeof(display) == 'undefined' || 'none' == display) { return; } // the paraent must be relative // and all elements with same level with the column element // must be marked with a class $(this).parent().css('position', 'relative').find('> *').each(function(){ if (!$(this).is(Sneeit_Sticky_Columns)) { $(this).addClass('ssc-disable'); } }); // clone this column with empty content var clone = $(this).clone(); // clone.html(''); clone.html('<div style="height:1px;clear:both;float:none;margin:0;padding:0"></div>'); // then inserting the clone to the real column // and mark it with a class $(clone).insertBefore($(this)).hide().addClass('ssc-clone ssc-clone-'+SSC_Index); // save data of the clone element to the column element // save original display css // and mark it as enabled $(this) .attr('data-ssc', '.ssc-clone-'+SSC_Index) .attr('data-display', display) .addClass('ssc-enable'); SSC_Index++; }); // fixme: // return; // Previous Top of Window before scrolling var SSC_PrevWinTop = 0; // Off set from top in case we have a fixed element // on top, example sticky menu var SSC_Off_Top = 0; function sneeit_sticky_columns() { // console.log('>>>>> sneeit_sticky_columns <<<<<'); // window info var win_top = $(window).scrollTop(); var win_hei = $(window).height(); var win_bot = win_top + win_hei; /* we must have offset on top just in case * have an element is fixing to prevent hide of column's top */ if ($('.sneeit-compact-menu-sticky').outerHeight()) { SSC_Off_Top = $('.sneeit-compact-menu-sticky').outerHeight(); } // with each enabled column $('.ssc-enable').each(function(){ // console.log($(this).attr('id')); /* show / hide clone to get original position data */ var clone = $($(this).attr('data-ssc')); var display = $(this).attr('data-display'); /* to prevent height changing of parent, * you should need to check if your current * sticky column is fixed or not * */ var par = clone.parent(); var par_style = par.attr('style'); var par_hei = par.height(); par.css('height', (par_hei+'px')).css('overflow','hidden'); var prev_clone_display = clone.css('display'); clone.css('display', display); $(this).hide(); var col_top = clone.offset().top; var col_wid = clone.width(); // clone.hide(); clone.css('display', prev_clone_display); $(this).css('display', display); if (par_style != 'undefined' && par_style) { par.attr('style', par_style); } else { par.removeAttr('style'); } /* the window scrolled over the original top of column * (the close save the original position (incl. top) of real col * so, the real col just return to its natural position * */ if (win_top < col_top) { // console.log('win_top < col_top', win_top, col_top); clone.hide(); $(this).css({ 'position' : '', 'top': '', 'left': '', 'bottom' : '', 'max-width' : '', }); return; } var col_hei = $(this).outerHeight(); // find referer which has max height var max_hei = 0; $(this).parent().find('> .ssc-disable').each(function(){ var hei = $(this).outerHeight(); if ($(this).offset().top == col_top && hei > max_hei) { max_hei = hei; } }); /* found nothing to refer or * found one, but its height even lower than this col */ if (!max_hei || max_hei < col_hei) { // console.log('IF !max_hei || max_hei < col_hei', max_hei, col_hei); clone.hide(); $(this).css({ 'position' : '', 'top': '', 'left': '', 'bottom' : '', 'max-width' : '', }); return; } /* everything is ok, now we calculate the fixed status */ var col_real_top = $(this).offset().top; var col_real_bot = col_real_top + col_hei; var ref_bot = col_top + max_hei; /* in case the col hei is too low */ if (col_hei <= win_hei) { // console.log('IF col_hei <= win_hei', col_hei, win_hei); if (win_top < ref_bot - col_hei - SSC_Off_Top) { // console.log(' - if win_top < ref_bot - col_hei - SSC_Off_Top', win_top, ref_bot, col_hei, SSC_Off_Top); clone.css('display', display); $(this).css({'position' : 'fixed'}); var margin_left = clone.css('margin-left'); margin_left = Number(margin_left.replace('px', '')); $(this).css({ 'top': SSC_Off_Top+'px', 'bottom' : '', 'left': (clone.offset().left - margin_left)+ 'px', 'max-width': col_wid+'px' }); } else { // console.log(' - else win_top < ref_bot - col_hei - SSC_Off_Top', win_top, ref_bot, col_hei, SSC_Off_Top); clone.css('display', display); $(this).hide(); var margin_left = clone.css('margin-left'); margin_left = Number(margin_left.replace('px', '')); $(this).css({ 'position' : 'relative', 'top': (max_hei - col_hei) + 'px', /* 'left': (clone.offset().left - margin_left) + 'px', */ 'left' : '', 'bottom' : '', 'max-width': col_wid+'px', }); $(this).css('display', display); clone.hide(); } } /* normal col hei is larger than win hei , most of cases*/ else { // console.log('ELSE col_hei <= win_hei', col_hei, win_hei); /* the bottom will over the ref bottom * so just keep the bottom of the col * equal to the ref bot */ if (win_bot >= ref_bot) { // console.log(' - if win_bot >= ref_bot', win_bot, ref_bot); clone.css('display', display); $(this).hide(); var margin_left = clone.css('margin-left'); margin_left = Number(margin_left.replace('px', '')); $(this).css({ 'position' : 'relative', 'top': (max_hei - col_hei) + 'px', /* 'left': (clone.offset().left - margin_left) + 'px', */ 'left' : '', 'bottom' : '', 'max-width': col_wid+'px' }); $(this).css('display', display); clone.hide(); } /* is scrolling up */ else if (win_top < SSC_PrevWinTop) { // console.log(' - else if win_top < SSC_PrevWinTop', win_top, SSC_PrevWinTop); /* this is not fixing bottom */ if (col_real_top < col_top) { // console.log(' -- if col_real_top < col_top', col_real_top, col_top); clone.hide(); $(this).css({ 'position' : '', 'top': '', 'left': '', 'bottom' : '', 'max-width' : '', }); } else if (col_real_top > win_top + SSC_Off_Top) { // console.log(' -- else if col_real_top > win_top + SSC_Off_Top', col_real_top, win_top, SSC_PrevWinTop ); clone.css('display', display); $(this).css({'position' : 'fixed'}); var margin_left = clone.css('margin-left'); margin_left = Number(margin_left.replace('px', '')); $(this).css({ 'top': SSC_Off_Top+'px', 'bottom' : '', 'left': (clone.offset().left - margin_left) + 'px', 'max-width': col_wid+'px' }); } else if ($(this).css('bottom') == '0px' && $(this).css('position') == 'fixed') { // console.log(' -- else if 1'); clone.hide(); $(this).css({ 'position' : 'relative', 'top': (col_real_top - col_top) + 'px', 'left': '', 'bottom' : '', 'max-width' : '', }); } } /* if scrolling down */ else if (win_top >= SSC_PrevWinTop) { // console.log(' - else if win_top >= SSC_PrevWinTop', win_top, SSC_PrevWinTop); /* this is not fixing top */ if (col_real_bot > ref_bot) { // console.log(' -- if col_real_bot > ref_bot', col_real_bot, ref_bot); clone.css('display', display); $(this).hide(); var margin_left = clone.css('margin-left'); margin_left = Number(margin_left.replace('px', '')); $(this).css({ 'position' : 'relative', 'top': (max_hei - col_hei) + 'px', /* 'left': (clone.offset().left - margin_left) + 'px',*/ 'left' : '', 'bottom' : '', 'max-width': col_wid+'px' }); $(this).css('display', display); clone.hide(); } else if (col_real_bot < win_bot) { // console.log(' -- else if col_real_bot < win_bot', col_real_bot, win_bot); clone.css('display', display); $(this).css({'position' : 'fixed'}); var margin_left = clone.css('margin-left'); margin_left = Number(margin_left.replace('px', '')); // console.log(' ---', // $('#delipress-sub-sidebar.ssc-enable').css('position'), // $('.ssc-clone-1').css('display'), // $('.ssc-clone-1').offset().left, // $('#delipress-main-sidebar.ssc-enable').css('position'), // $('.ssc-clone-0').css('display'), // $('.ssc-clone-0').offset().left // ); $(this).css({ 'top': '', 'bottom' : '0px', 'left': (clone.offset().left - margin_left) + 'px', 'max-width': col_wid+'px' }); } else if ( $(this).css('top') == (SSC_Off_Top+'px') && $(this).css('position') == 'fixed' ) { // console.log(' -- else if 2'); clone.hide(); $(this).css({ 'position' : 'relative', 'top': (col_real_top - col_top) + 'px', 'left': '', 'bottom' : '', 'max-width' : '', }); } } } }); } // console.log('INIT'); sneeit_sticky_columns(); // sticky sidebar when scrolling $(window).scroll(function() { // console.log('SCROLL'); sneeit_sticky_columns(); SSC_PrevWinTop = $(window).scrollTop(); }); $( document ).ajaxComplete(function() { // console.log('AJAX'); sneeit_sticky_columns(); }); }) (jQuery);