cipher87

Tabs Mouseover

Jun 26th, 2021
1,023
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. // -------------------------------------------------------------------------------------------
  2. // Tab Shortcode
  3. // -------------------------------------------------------------------------------------------
  4.  
  5. (function ($) {
  6.     "use strict";
  7.  
  8.     $.fn.avia_sc_tabs = function (options) {
  9.         var defaults =
  10.         {
  11.             heading: '.tab',
  12.             content: '.tab_content',
  13.             active: 'active_tab',
  14.             sidebar: false
  15.         };
  16.  
  17.         var win = $(window),
  18.             options = $.extend(defaults, options);
  19.  
  20.         return this.each(function () {
  21.             var container = $(this),
  22.                 tab_titles = $('<div class="tab_titles"></div>').prependTo(container),
  23.                 tabs = $(options.heading, container),
  24.                 content = $(options.content, container),
  25.                 newtabs = false,
  26.                 oldtabs = false;
  27.  
  28.             newtabs = tabs.clone();
  29.             oldtabs = tabs.addClass('fullsize-tab').attr('aria-hidden', true);
  30.             tabs = newtabs;
  31.  
  32.             tabs.prependTo(tab_titles).each(function (i) {
  33.                 var tab = $(this),
  34.                     the_oldtab = false;
  35.  
  36.                 if (newtabs) {
  37.                     the_oldtab = oldtabs.eq(i);
  38.                 }
  39.  
  40.                 tab.addClass('tab_counter_' + i).on('mouseover', function () {
  41.                     open_content(tab, i, the_oldtab);
  42.                     return false;
  43.                 });
  44.  
  45.                 tab.on('keydown', function (objEvent) {
  46.                     if (objEvent.keyCode === 13)  // if user presses 'enter'
  47.                     {
  48.                         tab.trigger('mouseover');
  49.                     }
  50.                 });
  51.  
  52.                 if (newtabs) {
  53.                     the_oldtab.on('mouseover', function () {
  54.                         open_content(the_oldtab, i, tab);
  55.                         return false;
  56.                     });
  57.  
  58.                     the_oldtab.on('keydown', function (objEvent) {
  59.                         if (objEvent.keyCode === 13)  // if user presses 'enter'
  60.                         {
  61.                             the_oldtab.trigger('mouseover');
  62.                         }
  63.                     });
  64.                 }
  65.             });
  66.  
  67.             set_size();
  68.             trigger_default_open(false);
  69.             win.on("debouncedresize", set_size);
  70.  
  71.             $('a').on('mouseover', function () {
  72.                 var hash = $(this).attr('href');
  73.                 if (typeof hash != "undefined" && hash) {
  74.                     hash = hash.replace(/^.*?#/, '');
  75.                     trigger_default_open('#' + hash);
  76.                 }
  77.             });
  78.  
  79.             function set_size() {
  80.                 if (!options.sidebar) {
  81.                     return;
  82.                 }
  83.  
  84.                 content.css({ 'min-height': tab_titles.outerHeight() + 1 });
  85.             }
  86.  
  87.             function open_content(tab, i, alternate_tab) {
  88.                 if (!tab.is('.' + options.active)) {
  89.                     $('.' + options.active, container).removeClass(options.active);
  90.                     $('.' + options.active + '_content', container).attr('aria-hidden', true).removeClass(options.active + '_content');
  91.  
  92.                     tab.addClass(options.active);
  93.  
  94.                     var new_loc = tab.data('fake-id');
  95.                     if (typeof new_loc == 'string') {
  96.                         window.location.replace(new_loc);
  97.                     }
  98.  
  99.                     if (alternate_tab) {
  100.                         alternate_tab.addClass(options.active);
  101.                     }
  102.  
  103.                     var active_c = content.eq(i).addClass(options.active + '_content').attr('aria-hidden', false);
  104.  
  105.                     if (typeof click_container != 'undefined' && click_container.length) {
  106.                         sidebar_shadow.height(active_c.outerHeight());
  107.                     }
  108.  
  109.                     //check if tab title is in viewport. if not scroll up
  110.                     var el_offset = active_c.offset().top,
  111.                         scoll_target = el_offset - 50 - parseInt($('html').css('margin-top'), 10);
  112.  
  113.                     if (win.scrollTop() > el_offset) {
  114.                         $('html:not(:animated),body:not(:animated)').scrollTop(scoll_target);
  115.                     }
  116.                 }
  117.  
  118.                 win.trigger('av-content-el-height-changed', tab);
  119.             }
  120.  
  121.             function trigger_default_open(hash) {
  122.                 if (!hash && window.location.hash) {
  123.                     hash = window.location.hash;
  124.                 }
  125.  
  126.                 if (!hash) {
  127.                     return;
  128.                 }
  129.  
  130.                 var open = tabs.filter('[data-fake-id="' + hash + '"]');
  131.  
  132.                 if (open.length) {
  133.                     if (!open.is('.active_tab')) {
  134.                         open.trigger('mouseover');
  135.                     }
  136.  
  137.                     window.scrollTo(0, container.offset().top - 70);
  138.                 }
  139.             }
  140.  
  141.         });
  142.     };
  143.  
  144.  
  145. }(jQuery));
  146.  
Advertisement
Add Comment
Please, Sign In to add comment