SHARE
TWEET

jquery.expandingpanels.js

a guest Feb 16th, 2014 174 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /*-------------------- EXPANDABLE PANELS ----------------------*/
  2. var panelspeed = 500; //panel animate speed in milliseconds
  3. var accordian = false; //set panels to behave like an accordian, with one panel only ever open at once    
  4.  
  5. var panelheight = new Array();
  6. var currentpanel = null;
  7. var highlightopen = true;
  8.  
  9. //Initialise collapsible panels
  10. function panelinit(openpanels) { // Pass an array of panel names without the cp- for them to be open
  11.   if (openpanels === undefined) openpanels = new Array();
  12.   panelheight = new Array();
  13.   var cp_openpanels = new Array(); // Array with the cp- prefix
  14.   $.each(openpanels, function(index, value) {
  15.     cp_openpanels[index] = 'cp-' + value;
  16.   });  
  17.   $("div[id*='cp-']").each(function() {
  18.     panelheight[$(this).attr('id')] = parseInt($(this).find('.expandable-panel-content').css('height'));
  19.     $(this).find('.expandable-panel-content').css('margin-top', -panelheight[$(this)]);
  20.     if ($.inArray($(this).attr('id'), cp_openpanels) >= 0) {
  21.       $(this).find('.expandable-panel-content').css('margin-top', 0);
  22.     }
  23.   });
  24.  
  25.   $('.expandable-panel-heading').click(function() {          
  26.     var obj = $(this).next();
  27.     var objid = $(this).parent().attr('ID');
  28.     currentpanel = objid;            
  29.     if (accordian == true) {
  30.       resetpanels();
  31.     }              
  32.     if (parseInt(obj.css('margin-top')) <= (panelheight[objid]*-1)) {
  33.       obj.clearQueue();
  34.       obj.stop();
  35.       obj.animate({'margin-top':0}, panelspeed);
  36.       if (highlightopen == true) {
  37.         $('#' + currentpanel + ' .expandable-panel-heading').addClass('header-active');
  38.       }
  39.     } else {
  40.       obj.clearQueue();
  41.       obj.stop();
  42.       obj.prev().find('.icon-close-open').css('background-position', '0px 0px');
  43.       obj.animate({'margin-top':(panelheight[objid]*-1)}, panelspeed);
  44.       if (highlightopen == true) {
  45.         $('#' + currentpanel + ' .expandable-panel-heading').removeClass('header-active');  
  46.       }
  47.     }
  48.   });
  49. }
  50.  
  51. function resetpanels() {
  52.     $("div[id*='cp-']").each(function(i) {
  53.         if (currentpanel != $(this)) {
  54.  
  55.             $(this).find('.icon-close-open').css('background-position', '0px 0px');
  56.             $(this).find('.expandable-panel-content').animate({'margin-top':-panelheight[$(this).attr('id')]}, panelspeed);
  57.             if (highlightopen == true) {
  58.                 $(this).find('.expandable-panel-heading').removeClass('header-active');
  59.             }
  60.         }
  61.     });
  62. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top