JQuery Accordion Menu Widget - Version 2.0

Version Description

  • Added : Ability to select either hover or click to activate menu
  • Added : Hover delay setting for hover event
  • Added : Close menu option for hover event
Download this release

Release Info

Developer remix4
Plugin Icon wp plugin JQuery Accordion Menu Widget
Version 2.0
Comparing to
See all releases

Code changes from version 1.1 to 2.0

Files changed (10) hide show
  1. dcwp_jquery_accordion.php +5 -4
  2. dcwp_jquery_accordion_widget.php +61 -34
  3. js/jquery.dcjqaccordion.2.0.js +205 -0
  4. js/jquery.dcjqaccordion.js +0 -122
  5. js/jquery.hoverIntent.minified.js +9 -0
  6. readme.txt +13 -3
  7. screenshot-1.png +0 -0
  8. skins/clean.css +1 -1
  9. skins/graphite.css +3 -3
  10. skins/grey.css +2 -2
dcwp_jquery_accordion.php CHANGED
@@ -2,10 +2,10 @@
2
  /*
3
  Plugin Name: jQuery Vertical Accordion Menu
4
  Plugin URI: http://www.designchemical.com/blog/index.php/wordpress-plugins/wordpress-plugin-jquery-vertical-accordion-menu-widget/
5
- Tags: jquery, dropdown, menu, vertical accordion, animated, css, navigation
6
- Description: Creates a widget, which allows you to create vertical accordion menus from any Wordpress custom menu using jQuery. Features include - handles multiple levels & saved state using cookies.
7
  Author: Lee Chestnutt
8
- Version: 1.1
9
  Author URI: http://www.designchemical.com
10
  */
11
 
@@ -22,8 +22,9 @@ class dc_jqaccordion {
22
 
23
  // Scripts
24
  wp_enqueue_script( 'jquery' );
 
25
  wp_enqueue_script( 'jquerycookie', dc_jqaccordion::get_plugin_directory() . '/js/jquery.cookie.js', array('jquery') );
26
- wp_enqueue_script( 'dcjqaccordion', dc_jqaccordion::get_plugin_directory() . '/js/jquery.dcjqaccordion.js', array('jquery') );
27
  }
28
  add_action( 'wp_footer', array('dc_jqaccordion', 'footer') );
29
 
2
  /*
3
  Plugin Name: jQuery Vertical Accordion Menu
4
  Plugin URI: http://www.designchemical.com/blog/index.php/wordpress-plugins/wordpress-plugin-jquery-vertical-accordion-menu-widget/
5
+ Tags: jquery, dropdown, menu, vertical accordion, animated, css, navigation, accordion
6
+ Description: Creates a widget, which allows you to create vertical accordion menus from any Wordpress custom menu using jQuery. Features include - handles multiple levels, saved state using cookies and option of selecting "click" or "hover" events for triggering the menu.
7
  Author: Lee Chestnutt
8
+ Version: 2.0
9
  Author URI: http://www.designchemical.com
10
  */
11
 
22
 
23
  // Scripts
24
  wp_enqueue_script( 'jquery' );
25
+ wp_enqueue_script( 'jqueryhoverintent', dc_jqaccordion::get_plugin_directory() . '/js/jquery.hoverIntent.minified.js', array('jquery') );
26
  wp_enqueue_script( 'jquerycookie', dc_jqaccordion::get_plugin_directory() . '/js/jquery.cookie.js', array('jquery') );
27
+ wp_enqueue_script( 'dcjqaccordion', dc_jqaccordion::get_plugin_directory() . '/js/jquery.dcjqaccordion.2.0.js', array('jquery') );
28
  }
29
  add_action( 'wp_footer', array('dc_jqaccordion', 'footer') );
30
 
dcwp_jquery_accordion_widget.php CHANGED
@@ -27,10 +27,13 @@ class dc_jqaccordion_widget extends WP_Widget {
27
  'title' => '',
28
  'classParent' => 'dcjq-parent',
29
  'classActive' => 'active',
 
 
 
30
  'autoClose' => 'on',
31
  'saveState' => 'on',
32
- 'disableLink' => 'on',
33
  'speed' => 'slow',
 
34
  'skin' => 'demo.css'
35
  );
36
  }
@@ -60,13 +63,9 @@ class dc_jqaccordion_widget extends WP_Widget {
60
 
61
  <div class="dcjq-accordion" id="<?php echo $this->id.'-item'; ?>">
62
 
63
- <?php
64
-
65
-
66
-
67
- wp_nav_menu( array( 'fallback_cb' => '', 'menu' => $nav_menu, 'container' => false ) );
68
-
69
- ?>
70
 
71
  </div>
72
  <?php
@@ -79,6 +78,7 @@ class dc_jqaccordion_widget extends WP_Widget {
79
  $instance['title'] = strip_tags( stripslashes($new_instance['title']) );
80
  $instance['nav_menu'] = (int) $new_instance['nav_menu'];
81
  $instance['autoClose'] = $new_instance['autoClose'];
 
82
  $instance['saveState'] = $new_instance['saveState'];
83
  $instance['disableLink'] = $new_instance['disableLink'];
84
  $instance['classParent'] = strip_tags( stripslashes($new_instance['classParent']) );
@@ -86,6 +86,7 @@ class dc_jqaccordion_widget extends WP_Widget {
86
  $instance['event'] = strip_tags( stripslashes($new_instance['event']) );
87
  $instance['skin'] = $new_instance['skin'];
88
  $instance['speed'] = $new_instance['speed'];
 
89
 
90
  return $instance;
91
  }
@@ -96,12 +97,14 @@ class dc_jqaccordion_widget extends WP_Widget {
96
  $nav_menu = isset( $instance['nav_menu'] ) ? $instance['nav_menu'] : '';
97
  if(! isset($instance['autoClose']) ){ $instance['autoClose'] = 'false'; }
98
  if(! isset($instance['saveState']) ){ $instance['saveState'] = 'false'; }
 
99
  if(! isset($instance['disableLink']) ){ $instance['disableLink'] = 'false'; }
100
  $classParent = isset( $instance['classParent'] ) ? $instance['classParent'] : '';
101
  $classActive = isset( $instance['classActive'] ) ? $instance['classActive'] : '';
102
  $event = isset( $instance['event'] ) ? $instance['event'] : '';
103
  $skin = isset( $instance['skin'] ) ? $instance['skin'] : '';
104
  $speed = isset( $instance['speed'] ) ? $instance['speed'] : '';
 
105
 
106
  $widget_options = wp_parse_args( $instance, $this->defaults );
107
  extract( $widget_options, EXTR_SKIP );
@@ -130,17 +133,45 @@ class dc_jqaccordion_widget extends WP_Widget {
130
  ?>
131
  </select>
132
  </p>
 
 
 
 
 
 
133
  <p>
134
  <input type="checkbox" value="true" class="checkbox" id="<?php echo $this->get_field_id('autoClose'); ?>" name="<?php echo $this->get_field_name('autoClose'); ?>"<?php checked( $autoClose, 'true' ); ?> />
135
  <label for="<?php echo $this->get_field_id('autoClose'); ?>"><?php _e( 'Auto Close Open Menus' , 'dcjq-accordion' ); ?></label><br />
136
-
137
  <input type="checkbox" value="true" class="checkbox" id="<?php echo $this->get_field_id('saveState'); ?>" name="<?php echo $this->get_field_name('saveState'); ?>"<?php checked( $saveState, 'true'); ?> />
138
  <label for="<?php echo $this->get_field_id('saveState'); ?>"><?php _e( 'Save Menu State (uses cookies)' , 'dcjq-accordion' ); ?></label><br />
139
 
140
  <input type="checkbox" value="true" class="checkbox" id="<?php echo $this->get_field_id('disableLink'); ?>" name="<?php echo $this->get_field_name('disableLink'); ?>"<?php checked( $disableLink, 'true' ); ?> />
141
  <label for="<?php echo $this->get_field_id('disableLink'); ?>"><?php _e( 'Disable Parent Links' , 'dcjq-accordion' ); ?></label><br />
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
142
  </p>
143
-
144
  <p><label for="<?php echo $this->get_field_id('skin'); ?>"><?php _e('Skin:', 'dcjq-accordion'); ?> <?php
145
 
146
  // http://www.codewalkers.com/c/a/File-Manipulation-Code/List-files-in-a-directory-no-subdirectories/
@@ -162,16 +193,6 @@ class dc_jqaccordion_widget extends WP_Widget {
162
  closedir($dh);
163
  echo "</select>"; ?> </label><br />
164
  </p>
165
-
166
- <p><label for="<?php echo $this->get_field_id('speed'); ?>"><?php _e('Animation Speed:', 'dcjq-accordion'); ?>
167
- <select name="<?php echo $this->get_field_name('speed'); ?>" id="<?php echo $this->get_field_id('speed'); ?>" >
168
- <option value='slow' <?php selected( $speed, 'slow'); ?> >Slow</option>
169
- <option value='normal' <?php selected( $speed, 'normal'); ?> >Normal</option>
170
- <option value='fast' <?php selected( $speed, 'fast'); ?> >Fast</option>
171
- </select>
172
- </label>
173
- </p>
174
- <input type="hidden" id="<?php echo $this->get_field_id('event'); ?>" name="<?php echo $this->get_field_name('event'); ?>" value="click" />
175
  <input type="hidden" id="<?php echo $this->get_field_id('classParent'); ?>" name="<?php echo $this->get_field_name('classParent'); ?>" value="dcjq-parent" />
176
  <input type="hidden" id="<?php echo $this->get_field_id('classActive'); ?>" name="<?php echo $this->get_field_name('classActive'); ?>" value="active" />
177
  <div class="widget-control-actions alignright">
@@ -185,8 +206,7 @@ class dc_jqaccordion_widget extends WP_Widget {
185
  function styles(){
186
 
187
  if(!is_admin()){
188
-
189
-
190
  $all_widgets = $this->get_settings();
191
 
192
  foreach ($all_widgets as $key => $wpdcjqaccordion){
@@ -207,22 +227,28 @@ class dc_jqaccordion_widget extends WP_Widget {
207
 
208
  if(!is_admin()){
209
 
210
- $all_widgets = $this->get_settings();
211
 
212
- foreach ($all_widgets as $key => $wpdcjqaccordion){
213
 
214
- $widget_id = $this->id_base . '-' . $key;
215
 
216
- if(is_active_widget(false, $widget_id, $this->id_base)){
217
 
218
- $autoClose = $wpdcjqaccordion['autoClose'];
219
- if($autoClose == ''){$autoClose = 'false';};
 
 
 
220
 
221
- $saveState = $wpdcjqaccordion['saveState'];
222
- if($saveState == ''){$saveState = 'false';};
223
 
224
- $disableLink = $wpdcjqaccordion['disableLink'];
225
- if($disableLink == ''){$disableLink = 'false';};
 
 
 
226
 
227
  ?>
228
  <script type="text/javascript">
@@ -230,7 +256,9 @@ class dc_jqaccordion_widget extends WP_Widget {
230
  jQuery('#<?php echo $widget_id.'-item'; ?> .menu').dcAccordion({
231
  classParent: '<?php echo $wpdcjqaccordion['classParent']; ?>',
232
  classActive: '<?php echo $wpdcjqaccordion['classActive']; ?>',
233
- event: '<?php echo $wpdcjqaccordion['event']; ?>',
 
 
234
  autoClose: <?php echo $autoClose; ?>,
235
  saveState: <?php echo $saveState; ?>,
236
  disableLink: <?php echo $disableLink; ?>,
@@ -240,7 +268,6 @@ class dc_jqaccordion_widget extends WP_Widget {
240
  </script>
241
 
242
  <?php
243
-
244
  }
245
  }
246
  }
27
  'title' => '',
28
  'classParent' => 'dcjq-parent',
29
  'classActive' => 'active',
30
+ 'event' => 'click',
31
+ 'hoverDelay' => '300',
32
+ 'menuClose' => 'on',
33
  'autoClose' => 'on',
34
  'saveState' => 'on',
 
35
  'speed' => 'slow',
36
+ 'disableLink' => 'on',
37
  'skin' => 'demo.css'
38
  );
39
  }
63
 
64
  <div class="dcjq-accordion" id="<?php echo $this->id.'-item'; ?>">
65
 
66
+ <?php
67
+ wp_nav_menu( array( 'fallback_cb' => '', 'menu' => $nav_menu, 'container' => false ) );
68
+ ?>
 
 
 
 
69
 
70
  </div>
71
  <?php
78
  $instance['title'] = strip_tags( stripslashes($new_instance['title']) );
79
  $instance['nav_menu'] = (int) $new_instance['nav_menu'];
80
  $instance['autoClose'] = $new_instance['autoClose'];
81
+ $instance['menuClose'] = $new_instance['menuClose'];
82
  $instance['saveState'] = $new_instance['saveState'];
83
  $instance['disableLink'] = $new_instance['disableLink'];
84
  $instance['classParent'] = strip_tags( stripslashes($new_instance['classParent']) );
86
  $instance['event'] = strip_tags( stripslashes($new_instance['event']) );
87
  $instance['skin'] = $new_instance['skin'];
88
  $instance['speed'] = $new_instance['speed'];
89
+ $instance['hoverDelay'] = $new_instance['hoverDelay'];
90
 
91
  return $instance;
92
  }
97
  $nav_menu = isset( $instance['nav_menu'] ) ? $instance['nav_menu'] : '';
98
  if(! isset($instance['autoClose']) ){ $instance['autoClose'] = 'false'; }
99
  if(! isset($instance['saveState']) ){ $instance['saveState'] = 'false'; }
100
+ if(! isset($instance['menuClose']) ){ $instance['menuClose'] = 'false'; }
101
  if(! isset($instance['disableLink']) ){ $instance['disableLink'] = 'false'; }
102
  $classParent = isset( $instance['classParent'] ) ? $instance['classParent'] : '';
103
  $classActive = isset( $instance['classActive'] ) ? $instance['classActive'] : '';
104
  $event = isset( $instance['event'] ) ? $instance['event'] : '';
105
  $skin = isset( $instance['skin'] ) ? $instance['skin'] : '';
106
  $speed = isset( $instance['speed'] ) ? $instance['speed'] : '';
107
+ $hoverDelay = isset( $instance['hoverDelay'] ) ? $instance['hoverDelay'] : '';
108
 
109
  $widget_options = wp_parse_args( $instance, $this->defaults );
110
  extract( $widget_options, EXTR_SKIP );
133
  ?>
134
  </select>
135
  </p>
136
+ <p>
137
+ <input type="radio" id="<?php echo $this->get_field_id('event1'); ?>" name="<?php echo $this->get_field_name('event'); ?>" value="click"<?php checked( $event, 'click' ); ?> />
138
+ <label for="<?php echo $this->get_field_id('event1'); ?>"><?php _e( 'Click' , 'dcjq-accordion' ); ?></label>
139
+ <input type="radio" id="<?php echo $this->get_field_id('event2'); ?>" name="<?php echo $this->get_field_name('event'); ?>" value="hover"<?php checked( $event, 'hover' ); ?> />
140
+ <label for="<?php echo $this->get_field_id('event2'); ?>"><?php _e( 'Hover' , 'dcjq-accordion' ); ?></label>
141
+ </p>
142
  <p>
143
  <input type="checkbox" value="true" class="checkbox" id="<?php echo $this->get_field_id('autoClose'); ?>" name="<?php echo $this->get_field_name('autoClose'); ?>"<?php checked( $autoClose, 'true' ); ?> />
144
  <label for="<?php echo $this->get_field_id('autoClose'); ?>"><?php _e( 'Auto Close Open Menus' , 'dcjq-accordion' ); ?></label><br />
145
+
146
  <input type="checkbox" value="true" class="checkbox" id="<?php echo $this->get_field_id('saveState'); ?>" name="<?php echo $this->get_field_name('saveState'); ?>"<?php checked( $saveState, 'true'); ?> />
147
  <label for="<?php echo $this->get_field_id('saveState'); ?>"><?php _e( 'Save Menu State (uses cookies)' , 'dcjq-accordion' ); ?></label><br />
148
 
149
  <input type="checkbox" value="true" class="checkbox" id="<?php echo $this->get_field_id('disableLink'); ?>" name="<?php echo $this->get_field_name('disableLink'); ?>"<?php checked( $disableLink, 'true' ); ?> />
150
  <label for="<?php echo $this->get_field_id('disableLink'); ?>"><?php _e( 'Disable Parent Links' , 'dcjq-accordion' ); ?></label><br />
151
+
152
+ <input type="checkbox" value="true" class="checkbox" id="<?php echo $this->get_field_id('menuClose'); ?>" name="<?php echo $this->get_field_name('menuClose'); ?>"<?php checked( $menuClose, 'true' ); ?> />
153
+ <label for="<?php echo $this->get_field_id('menuClose'); ?>"><?php _e( 'Close Menu (hover only)' , 'dcjq-accordion' ); ?></label>
154
+ </p>
155
+ <p>
156
+ <label for="<?php echo $this->get_field_id('hoverDelay'); ?>"><?php _e('Hover Delay:', 'dcjq-accordion'); ?>
157
+ <select name="<?php echo $this->get_field_name('hoverDelay'); ?>" id="<?php echo $this->get_field_id('hoverDelay'); ?>" >
158
+ <option value='0' <?php selected( $hoverDelay, '0'); ?> >No Delay</option>
159
+ <option value='200' <?php selected( $hoverDelay, '200'); ?> >0.2 sec</option>
160
+ <option value='400' <?php selected( $hoverDelay, '400'); ?> >0.4 sec</option>
161
+ <option value='600' <?php selected( $hoverDelay, '600'); ?> >0.6 sec</option>
162
+ <option value='800' <?php selected( $hoverDelay, '800'); ?> >0.8 sec</option>
163
+ <option value='1000' <?php selected( $hoverDelay, '1000'); ?> >1.0 sec</option>
164
+ </select>
165
+ </label>
166
+ </p>
167
+ <p><label for="<?php echo $this->get_field_id('speed'); ?>"><?php _e('Animation Speed:', 'dcjq-accordion'); ?>
168
+ <select name="<?php echo $this->get_field_name('speed'); ?>" id="<?php echo $this->get_field_id('speed'); ?>" >
169
+ <option value='slow' <?php selected( $speed, 'slow'); ?> >Slow</option>
170
+ <option value='normal' <?php selected( $speed, 'normal'); ?> >Normal</option>
171
+ <option value='fast' <?php selected( $speed, 'fast'); ?> >Fast</option>
172
+ </select>
173
+ </label>
174
  </p>
 
175
  <p><label for="<?php echo $this->get_field_id('skin'); ?>"><?php _e('Skin:', 'dcjq-accordion'); ?> <?php
176
 
177
  // http://www.codewalkers.com/c/a/File-Manipulation-Code/List-files-in-a-directory-no-subdirectories/
193
  closedir($dh);
194
  echo "</select>"; ?> </label><br />
195
  </p>
 
 
 
 
 
 
 
 
 
 
196
  <input type="hidden" id="<?php echo $this->get_field_id('classParent'); ?>" name="<?php echo $this->get_field_name('classParent'); ?>" value="dcjq-parent" />
197
  <input type="hidden" id="<?php echo $this->get_field_id('classActive'); ?>" name="<?php echo $this->get_field_name('classActive'); ?>" value="active" />
198
  <div class="widget-control-actions alignright">
206
  function styles(){
207
 
208
  if(!is_admin()){
209
+
 
210
  $all_widgets = $this->get_settings();
211
 
212
  foreach ($all_widgets as $key => $wpdcjqaccordion){
227
 
228
  if(!is_admin()){
229
 
230
+ $all_widgets = $this->get_settings();
231
 
232
+ foreach ($all_widgets as $key => $wpdcjqaccordion){
233
 
234
+ $widget_id = $this->id_base . '-' . $key;
235
 
236
+ if(is_active_widget(false, $widget_id, $this->id_base)){
237
 
238
+ $autoClose = $wpdcjqaccordion['autoClose'];
239
+ if($autoClose == ''){$autoClose = 'false';};
240
+
241
+ $saveState = $wpdcjqaccordion['saveState'];
242
+ if($saveState == ''){$saveState = 'false';};
243
 
244
+ $disableLink = $wpdcjqaccordion['disableLink'];
245
+ if($disableLink == ''){$disableLink = 'false';};
246
 
247
+ $menuClose = $wpdcjqaccordion['menuClose'];
248
+ if($menuClose == ''){$menuClose = 'false';};
249
+
250
+ $hoverDelay = $wpdcjqaccordion['hoverDelay'];
251
+ if($hoverDelay == ''){$hoverDelay = 600;};
252
 
253
  ?>
254
  <script type="text/javascript">
256
  jQuery('#<?php echo $widget_id.'-item'; ?> .menu').dcAccordion({
257
  classParent: '<?php echo $wpdcjqaccordion['classParent']; ?>',
258
  classActive: '<?php echo $wpdcjqaccordion['classActive']; ?>',
259
+ eventType: '<?php echo $wpdcjqaccordion['event']; ?>',
260
+ hoverDelay: <?php echo $hoverDelay; ?>,
261
+ menuClose: <?php echo $menuClose; ?>,
262
  autoClose: <?php echo $autoClose; ?>,
263
  saveState: <?php echo $saveState; ?>,
264
  disableLink: <?php echo $disableLink; ?>,
268
  </script>
269
 
270
  <?php
 
271
  }
272
  }
273
  }
js/jquery.dcjqaccordion.2.0.js ADDED
@@ -0,0 +1,205 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /*
2
+ * DC jQuery Accordion - jQuery accordion menu widget
3
+ * Copyright (c) 2011 Design Chemical
4
+ *
5
+ * Dual licensed under the MIT and GPL licenses:
6
+ * http://www.opensource.org/licenses/mit-license.php
7
+ * http://www.gnu.org/licenses/gpl.html
8
+ *
9
+ */
10
+ (function($){
11
+
12
+ //define the new for the plugin ans how to call it
13
+
14
+ $.fn.dcAccordion = function(options) {
15
+ //set default options
16
+ var defaults = {
17
+ classParent : 'dcjq-parent',
18
+ classActive : 'active',
19
+ eventType : 'click',
20
+ hoverDelay : 300,
21
+ menuClose : true,
22
+ autoClose : true,
23
+ speed : 'slow',
24
+ saveState : true,
25
+ disableLink : true
26
+ };
27
+
28
+ //call in the default otions
29
+ var options = $.extend(defaults, options);
30
+ var $dcAccordionItem = this;
31
+
32
+ //act upon the element that is passed into the design
33
+ return $dcAccordionItem.each(function(options){
34
+
35
+ setUpAccordion();
36
+
37
+ if(defaults.saveState == true){
38
+ cookieId = $(this).parent().attr('id');
39
+ checkCookie();
40
+ }
41
+ resetAccordion();
42
+
43
+ if(defaults.eventType == 'hover'){
44
+
45
+ var config = {
46
+ sensitivity: 2, // number = sensitivity threshold (must be 1 or higher)
47
+ interval: defaults.hoverDelay, // number = milliseconds for onMouseOver polling interval
48
+ over: linkOver, // function = onMouseOver callback (REQUIRED)
49
+ timeout: defaults.hoverDelay, // number = milliseconds delay before onMouseOut
50
+ out: linkOut // function = onMouseOut callback (REQUIRED)
51
+ };
52
+ $('li a',$dcAccordionItem).hoverIntent(config);
53
+
54
+ var configMenu = {
55
+ sensitivity: 2, // number = sensitivity threshold (must be 1 or higher)
56
+ interval: 1000, // number = milliseconds for onMouseOver polling interval
57
+ over: menuOver, // function = onMouseOver callback (REQUIRED)
58
+ timeout: 1000, // number = milliseconds delay before onMouseOut
59
+ out: menuOut // function = onMouseOut callback (REQUIRED)
60
+ };
61
+ $($dcAccordionItem).hoverIntent(configMenu);
62
+
63
+ // Disable parent links
64
+ if(defaults.disableLink == true){
65
+ $('li a',$dcAccordionItem).click(function(e){
66
+ if($(this).next('ul').length >0){
67
+ e.preventDefault();
68
+ }
69
+ });
70
+ }
71
+
72
+ } else {
73
+
74
+ $('li a',$dcAccordionItem).click(function(e){
75
+
76
+ $activeLi = $(this).parent('li');
77
+ $parentsLi = $activeLi.parents('li');
78
+ $parentsUl = $activeLi.parents('ul');
79
+
80
+ // Prevent browsing to link if has child links
81
+ if(defaults.disableLink == true){
82
+ if($(this).next('ul').length >0){
83
+ e.preventDefault();
84
+ }
85
+ }
86
+
87
+ // Auto close sibling menus
88
+ if(defaults.autoClose == true){
89
+ autoCloseAccordion($parentsLi, $parentsUl);
90
+ }
91
+
92
+ if ($('> ul',$activeLi).is(':visible')){
93
+ $('ul',$activeLi).slideUp(defaults.speed);
94
+ $('a',$activeLi).removeClass(defaults.classActive);
95
+ } else {
96
+ $(this).next().slideToggle(defaults.speed);
97
+ $('> a',$activeLi).addClass(defaults.classActive);
98
+ }
99
+
100
+ // Write cookie if save state is on
101
+ if(defaults.saveState == true){
102
+ createCookie();
103
+ }
104
+ });
105
+ }
106
+ // Set up accordion
107
+ function setUpAccordion(){
108
+ $arrow = '<span class="dcjq-icon"></span>';
109
+ $('> ul',$dcAccordionItem).show();
110
+ $('li',$dcAccordionItem).each(function(){
111
+ var classParentLi = defaults.classParent+'-li';
112
+ if($('> ul',this).length > 0){
113
+ $(this).addClass(classParentLi);
114
+ $('> a',this).addClass(defaults.classParent).append($arrow);
115
+ }
116
+ });
117
+ $('> ul',$dcAccordionItem).hide();
118
+ }
119
+ });
120
+
121
+ function linkOver(){
122
+
123
+ $activeLi = $(this).parent('li');
124
+ $parentsLi = $activeLi.parents('li');
125
+ $parentsUl = $activeLi.parents('ul');
126
+
127
+ // Auto close sibling menus
128
+ if(defaults.autoClose == true){
129
+ autoCloseAccordion($parentsLi, $parentsUl);
130
+ }
131
+
132
+ if ($('> ul',$activeLi).is(':visible')){
133
+ $('ul',$activeLi).slideUp(defaults.speed);
134
+ $('a',$activeLi).removeClass(defaults.classActive);
135
+ } else {
136
+ $(this).next().slideToggle(defaults.speed);
137
+ $('> a',$activeLi).addClass(defaults.classActive);
138
+ }
139
+
140
+ // Write cookie if save state is on
141
+ if(defaults.saveState == true){
142
+ createCookie();
143
+ }
144
+
145
+ }
146
+
147
+ function linkOut(){
148
+ }
149
+
150
+ function menuOver(){
151
+ }
152
+
153
+ function menuOut(){
154
+ if(defaults.menuClose == true){
155
+ $('ul',$dcAccordionItem).slideUp(defaults.speed);
156
+ // Reset active links
157
+ $('a',$dcAccordionItem).removeClass(defaults.classActive);
158
+ createCookie();
159
+ }
160
+ }
161
+
162
+ // Auto-Close Open Menu Items
163
+ function autoCloseAccordion($parentsLi, $parentsUl){
164
+ $('ul',$dcAccordionItem).not($parentsUl).slideUp(defaults.speed);
165
+ // Reset active links
166
+ $('a',$dcAccordionItem).removeClass(defaults.classActive);
167
+ $('> a',$parentsLi).addClass(defaults.classActive);
168
+ }
169
+
170
+ // Retrieve cookie value and set active items
171
+ function checkCookie(){
172
+ var cookieVal = $.cookie(cookieId);
173
+ if(cookieVal != null){
174
+ // create array from cookie string
175
+ var activeArray = cookieVal.split(',');
176
+ $.each(activeArray, function(index,value){
177
+ var $cookieLi = $('li:eq('+value+')',$dcAccordionItem);
178
+ $('> a',$cookieLi).addClass(defaults.classActive);
179
+ var $parentsLi = $cookieLi.parents('li');
180
+ $('> a',$parentsLi).addClass(defaults.classActive);
181
+ });
182
+ }
183
+ }
184
+
185
+ // Reset accordion using active links
186
+ function resetAccordion(){
187
+ $('ul',$dcAccordionItem).hide();
188
+ $allActiveLi = $('a.'+defaults.classActive,$dcAccordionItem);
189
+ $allActiveLi.next().show();
190
+ }
191
+
192
+ // Write cookie
193
+ function createCookie(){
194
+ var activeIndex = [];
195
+ // Create array of active items index value
196
+ $('li a.active',$dcAccordionItem).each(function(i){
197
+ var $arrayItem = $(this).parent('li');
198
+ var itemIndex = $('li',$dcAccordionItem).index($arrayItem);
199
+ activeIndex.push(itemIndex);
200
+ });
201
+ // Store in cookie
202
+ $.cookie(cookieId, activeIndex, { path: '/' });
203
+ }
204
+ };
205
+ })(jQuery);
js/jquery.dcjqaccordion.js DELETED
@@ -1,122 +0,0 @@
1
- /*
2
- * DC jQuery Accordion - jQuery accordion menu widget
3
- * Copyright (c) 2011 Design Chemical
4
- *
5
- * Dual licensed under the MIT and GPL licenses:
6
- * http://www.opensource.org/licenses/mit-license.php
7
- * http://www.gnu.org/licenses/gpl.html
8
- *
9
- */
10
- (function($){
11
-
12
- //define the function for the plugin and how to call it
13
-
14
- $.fn.dcAccordion = function(options) {
15
- //set default options
16
- var defaults = {
17
- classParent : 'dcjq-parent',
18
- classActive : 'active',
19
- eventType : 'click',
20
- autoArrow : true,
21
- canClose : true,
22
- autoClose : true,
23
- speed : 'slow',
24
- saveState : true,
25
- activate : 'click',
26
- disableLink : true
27
- };
28
-
29
- //call in the default otions
30
- var options = $.extend(defaults, options);
31
- var $dcAccordionItem = this;
32
-
33
- //act upon the element that is passed into the design
34
- return $dcAccordionItem.each(function(options) {
35
-
36
- setUpAccordion();
37
-
38
- if(defaults.saveState == true){
39
- var cookieId = $(this).parent().attr('id');
40
- checkCookie();
41
- }
42
- resetAccordion();
43
-
44
- $('li a',$dcAccordionItem).click(function(e){
45
-
46
- var $activeLi = $(this).parent('li');
47
- var $parentsLi = $activeLi.parents('li');
48
- var $parentsUl = $activeLi.parents('ul');
49
-
50
- // Prevent browsing to link if has child links
51
- if(defaults.disableLink == true){
52
- if($(this).next('ul').length >0){
53
- e.preventDefault();
54
- }
55
- }
56
-
57
- // Auto close sibling menus
58
- if(defaults.autoClose == true){
59
- $('ul',$dcAccordionItem).not($parentsUl).slideUp(defaults.speed);
60
- // Reset active links
61
- $('a',$dcAccordionItem).removeClass(defaults.classActive);
62
- $('> a',$parentsLi).addClass(defaults.classActive);
63
- }
64
-
65
- if ($('> ul',$activeLi).is(':visible')){
66
- $('ul',$activeLi).slideUp(defaults.speed);
67
- $('a',$activeLi).removeClass(defaults.classActive);
68
- } else {
69
- $(this).next().slideToggle(defaults.speed);
70
- $('> a',$activeLi).addClass(defaults.classActive);
71
- }
72
-
73
- // Write cookie if save state is on
74
- if(defaults.saveState == true){
75
- var activeIndex = [];
76
- // Create array of active items index value
77
- $('li a.active',$dcAccordionItem).each(function(i){
78
- var $arrayItem = $(this).parent('li');
79
- var itemIndex = $('li',$dcAccordionItem).index($arrayItem);
80
- activeIndex.push(itemIndex);
81
- });
82
- // Store in cookie
83
- $.cookie(cookieId, activeIndex, { path: '/' });
84
- }
85
- });
86
-
87
- // Set up accordion
88
- function setUpAccordion(){
89
- $arrow = '<span class="dcjq-icon"></span>';
90
- $('li',$dcAccordionItem).each(function(){
91
- var classParentLi = defaults.classParent+'-li';
92
- if($('> ul',this).length > 0){
93
- $(this).addClass(classParentLi);
94
- $('> a',this).addClass(defaults.classParent).append($arrow);
95
- }
96
- });
97
- }
98
-
99
- // Retrieve cookie value and set active items
100
- function checkCookie(){
101
- var cookieVal = $.cookie(cookieId);
102
- if(cookieVal != null){
103
- // create array from cookie string
104
- var activeArray = cookieVal.split(',');
105
- $.each(activeArray, function(index,value){
106
- var $cookieLi = $('li:eq('+value+')',$dcAccordionItem);
107
- $('> a',$cookieLi).addClass(defaults.classActive);
108
- var $parentsLi = $cookieLi.parents('li');
109
- $('> a',$parentsLi).addClass(defaults.classActive);
110
- });
111
- }
112
- }
113
-
114
- // Reset accordion using active links
115
- function resetAccordion(){
116
- $('ul',$dcAccordionItem).hide();
117
- $allActiveLi = $('a.'+defaults.classActive,$dcAccordionItem);
118
- $allActiveLi.next().show();
119
- }
120
- });
121
- };
122
- })(jQuery);
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
js/jquery.hoverIntent.minified.js ADDED
@@ -0,0 +1,9 @@
 
 
 
 
 
 
 
 
 
1
+ /**
2
+ * hoverIntent r5 // 2007.03.27 // jQuery 1.1.2+
3
+ * <http://cherne.net/brian/resources/jquery.hoverIntent.html>
4
+ *
5
+ * @param f onMouseOver function || An object with configuration options
6
+ * @param g onMouseOut function || Nothing (use configuration options object)
7
+ * @author Brian Cherne <brian@cherne.net>
8
+ */
9
+ (function($){$.fn.hoverIntent=function(f,g){var cfg={sensitivity:7,interval:100,timeout:0};cfg=$.extend(cfg,g?{over:f,out:g}:f);var cX,cY,pX,pY;var track=function(ev){cX=ev.pageX;cY=ev.pageY;};var compare=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);if((Math.abs(pX-cX)+Math.abs(pY-cY))<cfg.sensitivity){$(ob).unbind("mousemove",track);ob.hoverIntent_s=1;return cfg.over.apply(ob,[ev]);}else{pX=cX;pY=cY;ob.hoverIntent_t=setTimeout(function(){compare(ev,ob);},cfg.interval);}};var delay=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);ob.hoverIntent_s=0;return cfg.out.apply(ob,[ev]);};var handleHover=function(e){var p=(e.type=="mouseover"?e.fromElement:e.toElement)||e.relatedTarget;while(p&&p!=this){try{p=p.parentNode;}catch(e){p=this;}}if(p==this){return false;}var ev=jQuery.extend({},e);var ob=this;if(ob.hoverIntent_t){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);}if(e.type=="mouseover"){pX=ev.pageX;pY=ev.pageY;$(ob).bind("mousemove",track);if(ob.hoverIntent_s!=1){ob.hoverIntent_t=setTimeout(function(){compare(ev,ob);},cfg.interval);}}else{$(ob).unbind("mousemove",track);if(ob.hoverIntent_s==1){ob.hoverIntent_t=setTimeout(function(){delay(ev,ob);},cfg.timeout);}}};return this.mouseover(handleHover).mouseout(handleHover);};})(jQuery);
readme.txt CHANGED
@@ -4,23 +4,28 @@ Donate link: http://www.designchemical.com
4
  Tags: jquery, dropdown, menu, vertical accordion, animated, css, navigation, widget
5
  Requires at least: 3.0
6
  Tested up to: 3.1
7
- Stable tag: 1.1
8
 
9
  Creates a widget, which allows you to create vertical accordion menus from any Wordpress custom menu using jQuery.
10
 
11
  == Description ==
12
 
13
- Creates a widget, which allows you to create vertical accordion menus from any Wordpress custom menu using jQuery. Features include - handles multiple levels & saved state using cookies. Uses the jquery cookie plugin by [Klaus Hartl](http://www.stilbuero.de).
14
 
15
  = Menu Options =
16
 
17
  The widget has several parameters that can be configured to help cutomise the vertical accordion menu:
18
 
 
19
  * Auto-close open menus - If checked this will allow only one menu item to be expanded at any time. Clicking on a new menu item will automatically close the previous one.
20
  * Save menu state (uses cookies) - Selecting this will allow the menu to remember its open/close state when browsing to a new page.
21
  * Disable parent links - If selected, any menu items that have child elements will have their links disabled and will only open/close their relevant sub-menus. Do not select this if you want the user to still be able to browse to that item's page.
22
- * Skin - Several sample skins are available to give examples of css that can be used to style your accordion menu
 
23
  * Animation Speed - The speed at which the menu will open/close
 
 
 
24
 
25
  [__See demo__](http://www.designchemical.com/lab/demo-wordpress-vertical-accordion-menu-plugin/)
26
 
@@ -48,6 +53,11 @@ Another likely cause is due to other non-functioning plugins, which may have err
48
 
49
  == Changelog ==
50
 
 
 
 
 
 
51
  = 1.1 =
52
  * Fixed : Duplicate ID with themes adding ID to widget container
53
  * Fixed : Set cookie path
4
  Tags: jquery, dropdown, menu, vertical accordion, animated, css, navigation, widget
5
  Requires at least: 3.0
6
  Tested up to: 3.1
7
+ Stable tag: 2.0
8
 
9
  Creates a widget, which allows you to create vertical accordion menus from any Wordpress custom menu using jQuery.
10
 
11
  == Description ==
12
 
13
+ Creates a widget, which allows you to create vertical accordion menus from any Wordpress custom menu using jQuery. Features include - handles multiple levels, saved state using cookies and option of selecting "click" or "hover" events for triggering the menu. Uses the jquery cookie plugin by [Klaus Hartl](http://www.stilbuero.de).
14
 
15
  = Menu Options =
16
 
17
  The widget has several parameters that can be configured to help cutomise the vertical accordion menu:
18
 
19
+ * Click/Hover - Selects the event type that will trigger the menu to open/close
20
  * Auto-close open menus - If checked this will allow only one menu item to be expanded at any time. Clicking on a new menu item will automatically close the previous one.
21
  * Save menu state (uses cookies) - Selecting this will allow the menu to remember its open/close state when browsing to a new page.
22
  * Disable parent links - If selected, any menu items that have child elements will have their links disabled and will only open/close their relevant sub-menus. Do not select this if you want the user to still be able to browse to that item's page.
23
+ * Close menu (hover only) - If checked the menu will automatically fully close after 1 second when the mouse moves off the menu - only available if event type is "hover"
24
+ * Hover delay - This setting adds a delay to the hover event to help prevent the menu opening/closing accidentally. A higher number means the cursor must stop moving for longer before the menu action will trigger
25
  * Animation Speed - The speed at which the menu will open/close
26
+ * Skin - Several sample skins are available to give examples of css that can be used to style your accordion menu
27
+
28
+ Note: care should be taken when selecting the hover event as this may impact useability - adding a hover delay and reducing the animation speed may help reduce problems with useability
29
 
30
  [__See demo__](http://www.designchemical.com/lab/demo-wordpress-vertical-accordion-menu-plugin/)
31
 
53
 
54
  == Changelog ==
55
 
56
+ = 2.0 =
57
+ * Added : Ability to select either hover or click to activate menu
58
+ * Added : Hover delay setting for hover event
59
+ * Added : Close menu option for hover event
60
+
61
  = 1.1 =
62
  * Fixed : Duplicate ID with themes adding ID to widget container
63
  * Fixed : Set cookie path
screenshot-1.png CHANGED
Binary file
skins/clean.css CHANGED
@@ -2,7 +2,7 @@
2
  #dc_jqaccordion_widget-%ID%-item ul, #dc_jqaccordion_widget-%ID%-item ul li {margin: 0; padding: 0; border: none;}
3
  #dc_jqaccordion_widget-%ID%-item ul a {padding: 10px 15px; background: #fff url(skins/images/bg_clean.png) repeat-x top center; font-weight: bold; text-transform: uppercase; text-decoration:none; display: block; color: #222; border-bottom: 1px solid #cfcfcf;}
4
  #dc_jqaccordion_widget-%ID%-item ul ul a {padding: 10px 10px 10px 25px; background: #fff; font-weight: normal; text-transform: capitalize;}
5
- #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent {padding: 10px 15px; background: #fff url(skins/images/bg_clean.png) repeat-x top center; font-weight: bold; text-transform: uppercase;}
6
  #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent:hover {background: #fff url(skins/images/bg_clean_on.png) repeat-x top center;}
7
  #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent.active {}
8
  #dc_jqaccordion_widget-%ID%-item ul a:hover {background: #ececec; color: #990000;}
2
  #dc_jqaccordion_widget-%ID%-item ul, #dc_jqaccordion_widget-%ID%-item ul li {margin: 0; padding: 0; border: none;}
3
  #dc_jqaccordion_widget-%ID%-item ul a {padding: 10px 15px; background: #fff url(skins/images/bg_clean.png) repeat-x top center; font-weight: bold; text-transform: uppercase; text-decoration:none; display: block; color: #222; border-bottom: 1px solid #cfcfcf;}
4
  #dc_jqaccordion_widget-%ID%-item ul ul a {padding: 10px 10px 10px 25px; background: #fff; font-weight: normal; text-transform: capitalize;}
5
+ #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent {padding: 10px 15px; background: #efefef url(skins/images/bg_clean.png) repeat-x top center; font-weight: bold; text-transform: uppercase;}
6
  #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent:hover {background: #fff url(skins/images/bg_clean_on.png) repeat-x top center;}
7
  #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent.active {}
8
  #dc_jqaccordion_widget-%ID%-item ul a:hover {background: #ececec; color: #990000;}
skins/graphite.css CHANGED
@@ -1,10 +1,10 @@
1
  #dc_jqaccordion_widget-%ID%-item{font: bold 14px Arial, sans-serif; border-top: 1px solid #111; border-right: 1px solid #111; border-left: 1px solid #111;}
2
  #dc_jqaccordion_widget-%ID%-item ul, #dc_jqaccordion_widget-%ID%-item ul li {margin: 0; padding: 0; border: none;}
3
- #dc_jqaccordion_widget-%ID%-item ul a {padding: 10px 10px 10px 50px; background: #000 url(skins/images/bg_black.png) repeat-x 0 -1px; text-decoration:none; display: block; color: #ddd; border-bottom: 1px solid #222; border-top: 1px solid #777; position: relative;}
4
  #dc_jqaccordion_widget-%ID%-item ul ul a {background: #424549;}
5
- #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent, #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent:hover {background: #000 url(skins/images/bg_black.png) repeat-x 0 -1px;}
6
  #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent.active {}
7
- #dc_jqaccordion_widget-%ID%-item ul a .dcjq-icon {position: absolute; top: 0; left: 12px; width: 34px; height: 34px; background: url(skins/images/arrow_black_right.png) no-repeat 0 center;}
8
  #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent.active .dcjq-icon {background: url(skins/images/arrow_black_down.png) no-repeat 0 center;}
9
  #dc_jqaccordion_widget-%ID%-item ul a:hover {background: #232323; color: #fff;}
10
  #dc_jqaccordion_widget-%ID%-item ul a:active{}
1
  #dc_jqaccordion_widget-%ID%-item{font: bold 14px Arial, sans-serif; border-top: 1px solid #111; border-right: 1px solid #111; border-left: 1px solid #111;}
2
  #dc_jqaccordion_widget-%ID%-item ul, #dc_jqaccordion_widget-%ID%-item ul li {margin: 0; padding: 0; border: none;}
3
+ #dc_jqaccordion_widget-%ID%-item ul a {padding: 10px 10px 10px 50px; background: #0C0C0C url(skins/images/bg_black.png) repeat-x 0 -1px; text-decoration:none; display: block; color: #ddd; border-bottom: 1px solid #222; border-top: 1px solid #777; position: relative;}
4
  #dc_jqaccordion_widget-%ID%-item ul ul a {background: #424549;}
5
+ #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent, #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent:hover {background: #0C0C0C url(skins/images/bg_black.png) repeat-x 0 -1px;}
6
  #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent.active {}
7
+ #dc_jqaccordion_widget-%ID%-item ul a .dcjq-icon {position: absolute; top: 50%; left: 14px; width: 34px; margin-top: -17px; height: 34px; background: url(skins/images/arrow_black_right.png) no-repeat 0 center;}
8
  #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent.active .dcjq-icon {background: url(skins/images/arrow_black_down.png) no-repeat 0 center;}
9
  #dc_jqaccordion_widget-%ID%-item ul a:hover {background: #232323; color: #fff;}
10
  #dc_jqaccordion_widget-%ID%-item ul a:active{}
skins/grey.css CHANGED
@@ -1,9 +1,9 @@
1
  #dc_jqaccordion_widget-%ID%-item{font: bold 14px Arial, sans-serif; border-top: 1px solid #ccc; border-right: 1px solid #ccc; border-left: 1px solid #ccc;}
2
  #dc_jqaccordion_widget-%ID%-item ul, #dc_jqaccordion_widget-%ID%-item ul li {margin: 0; padding: 0; border: none;}
3
  #dc_jqaccordion_widget-%ID%-item ul a {padding: 10px 10px 10px 50px; background: #ececec; text-decoration:none; display: block; color: #333; border-bottom: 1px solid #ccc; border-top: 1px solid #fff; position: relative; text-shadow: 1px 1px 1px #fff;}
4
- #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent, #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent:hover {background: #ececec url(skins/images/bg_grey.png) repeat-x 0 -1px;}
5
  #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent.active {}
6
- #dc_jqaccordion_widget-%ID%-item ul a .dcjq-icon {position: absolute; top: 0; left: 12px; width: 34px; height: 34px; background: url(skins/images/arrow_grey_right.png) no-repeat 0 center;}
7
  #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent.active .dcjq-icon {background: url(skins/images/arrow_grey_down.png) no-repeat 0 center;}
8
  #dc_jqaccordion_widget-%ID%-item ul a:hover {background: #fff; color: #990000;}
9
  #dc_jqaccordion_widget-%ID%-item ul a:active{}
1
  #dc_jqaccordion_widget-%ID%-item{font: bold 14px Arial, sans-serif; border-top: 1px solid #ccc; border-right: 1px solid #ccc; border-left: 1px solid #ccc;}
2
  #dc_jqaccordion_widget-%ID%-item ul, #dc_jqaccordion_widget-%ID%-item ul li {margin: 0; padding: 0; border: none;}
3
  #dc_jqaccordion_widget-%ID%-item ul a {padding: 10px 10px 10px 50px; background: #ececec; text-decoration:none; display: block; color: #333; border-bottom: 1px solid #ccc; border-top: 1px solid #fff; position: relative; text-shadow: 1px 1px 1px #fff;}
4
+ #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent, #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent:hover {background: #D7D4D4 url(skins/images/bg_grey.png) repeat-x 0 -1px;}
5
  #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent.active {}
6
+ #dc_jqaccordion_widget-%ID%-item ul a .dcjq-icon {position: absolute; top: 50%; left: 14px; width: 34px; margin-top: -17px; height: 34px; background: url(skins/images/arrow_grey_right.png) no-repeat 0 center;}
7
  #dc_jqaccordion_widget-%ID%-item ul a.dcjq-parent.active .dcjq-icon {background: url(skins/images/arrow_grey_down.png) no-repeat 0 center;}
8
  #dc_jqaccordion_widget-%ID%-item ul a:hover {background: #fff; color: #990000;}
9
  #dc_jqaccordion_widget-%ID%-item ul a:active{}