https://dhsprogram.com/_cs_widgets/_resources/csw-button-styles.js

1/* 
2	csw-button-styles.js
3   
4   Version: [2018-01-08 15:38 pm]
5*/
6
7jQuery(document).ready(function(){
8	
9   // Init the button hover effects
10   initButtonHoverEffects();
11
12});
13
14
15function initButtonHoverEffects() {
16	
17   // register a mouseenter event
18	jQuery('.cswBtn-outlined,.cswBtn-outlined-thin,.cswBtn-outlined-thick,.cswBtn-filled-border').mouseenter( function() {
19      if ( jQuery(this).hasClass('cswEffect-default') || jQuery(this).hasClass('cswEffect-fill') )
20         toggleButtonColors( jQuery(this), 'enter' );		
21	});
22   
23   // register a mouseleave event
24	jQuery('.cswBtn-outlined,.cswBtn-outlined-thin,.cswBtn-outlined-thick,.cswBtn-filled-border').mouseleave( function() {
25      if ( jQuery(this).hasClass('cswEffect-default') || jQuery(this).hasClass('cswEffect-fill') )
26         toggleButtonColors( jQuery(this), 'leave' );		
27	});	
28
29}
30
31// Init a global variable to remember the last hover state
32var lastHoverState = '';
33
34function toggleButtonColors(el,state) {
35 
36	var curBtnEl = jQuery(el); 
37	var curBtnColor = curBtnEl.css( "color" );
38   var curBtnBgColor = curBtnEl.css( "background-color" );
39	var curTextEl = curBtnEl.find('span');
40	var curTextColor = curTextEl.css( "color" );
41	var curIconEl = curBtnEl.find('i');
42   var currBtnBorderColor = curBtnEl.css("border-top-color"); // Get the color of one of the border sides
43   //var toggledClass = 'cswBtnColors-toggled';
44   
45   if ( state !== lastHoverState )
46   {
47      // Set the Text Color to the BG Color
48      curTextEl.css('color',curBtnBgColor);
49      // Set the Button BG Color to the Text Color
50      curBtnEl.css('background-color',curTextColor);	
51      // Set the Button Text Color to the BG Color             
52      curBtnEl.css('color',curBtnBgColor);
53
54      // Check if data-border-color exists, if not set it
55      if( typeof curBtnEl.data('border-color') == 'undefined' || curBtnEl.data('border-color') == 'undefined' )
56      {
57         curBtnEl.data('border-color', currBtnBorderColor );
58         

59         // Set Border color to current Background Color
60         curBtnEl.css({"border-color":curBtnBgColor});
61      }
62      else
63      {
64         // Get Border Color from Data Attr
65         currBtnBorderColor = curBtnEl.data('border-color' );
66         
67         // Set Border Color
68         curBtnEl.css({"border-color":currBtnBorderColor});
69         
70         // Remove Data Attribute
71         curBtnEl.removeAttr('data-border-color');
72      }
73      
74      // Set the Icon Color to what the BG Color used to be
75      if ( curIconEl.length ) 
76         curIconEl.css('color',curBtnBgColor);
77      
78      /*if ( curBtnEl.hasClass(toggledClass) )
79         curBtnEl.removeClass(toggledClass);
80      else
81         curBtnEl.addClass(toggledClass);*/
82      
83      // Set the last hover state  
84      lastHoverState =	state;
85   }   
86
87}