Difference between revisions of "JQuery"
From Blue-IT.org Wiki
Line 124: | Line 124: | ||
[[Category:Web Development]] | [[Category:Web Development]] | ||
[[Category:Drupal]] | [[Category:Drupal]] | ||
− |
Latest revision as of 20:28, 8 January 2012
Contents
Drupal
cycle Plugin
<?php drupal_add_library('jquery_plugin', 'cycle'); drupal_add_js('jQuery(document).ready(function() {jQuery("#mySlideshow").cycle({ fx: \'scrollDown\', speed: 2000, timeout: 20000 });});', 'inline'); <div id="mySlideshow" class="slideshow"> <img src="1.png" /> <img src="2.png" /> </div> ?>
IE 7 / 8 Bugs
cleartype: true, cleartypeNoBg: true // jQuery cycle bug for IE 7 and 8 - backgrounds added to cycle elements
Accordion Plugin
<?php drupal_add_library('system', 'ui.accordion'); drupal_add_js('jQuery(document).ready(function(){jQuery("#myCustomDiv").accordion();});', 'inline'); ?> <div id="myCustomDiv"> <h3><a href="#">Section 1</a></h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> <h3><a href="#">Section 2</a></h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> <h3><a href="#">Section 3</a></h3> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> </div>
Be aware that the following is no valid code.
Only Snippets
(function ($) { Drupal.behaviors.naturalessenceTheme = { attach: function(context, settings) { $('#navigation ul', context).superfish({ animation: { opacity: 'show', height:'show' }, speed: 250, autoArrows: false, dropShadows: false /* Needed for IE */ }); } }; })(jQuery);(function ($) { Drupal.behaviors.naturalessenceTheme = { attach: function(context, settings) { $('#navigation ul', context).superfish({ animation: { opacity: 'show', height:'show' }, speed: 250, autoArrows: false, dropShadows: false /* Needed for IE */ }); } }; })(jQuery); ------------------------------------------------------------------------ $settings['jquery_plugin.cycle'] = array ( 'fx' => 'fade', 'speed' => '10000' ); drupal_add_js($settings, 'setting'); ------------------------------------------------------------------- drupal_add_js( array ( 'jquery_plugin.cycle' => array ( 'fx' => 'scrollDown', 'speed' => 700, 'timout' => 2000 )), 'setting'); -------------------------------------------------------------------- drupal_add_js( array ( 'jquery_plugin.cycle' => array ( 'fx' => 'scrollDown' ) ) , 'setting' ); -------------------------------------------------------------------- function cycle_init () { $settings['cycle'] = array ( 'fx' => 'scrollDown', 'speed' => '700', 'timeout' => '2000' ); drupal_add_js ( $settings, 'setting' ); } Drupal.behaviors.cycle = function (context) { var option = { fx: 'Drupal.settings.cycle.fx', speed: Drupal.settings.cycle.speed, timeout: Drupal.settings.cycle.timeout }; }; --------------------------------------------------------------------