Difference between revisions of "JQuery"
From Blue-IT.org Wiki
(Created page with "= Drupal = == cycle Plugin == <?php drupal_add_library('jquery_plugin', 'cycle'); drupal_add_js('jQuery(document).ready(function() {jQuery("#mySlideshow").cycle({ fx: ...") |
(→cycle Plugin) |
||
| Line 9: | Line 9: | ||
timeout: 20000 | timeout: 20000 | ||
});});', 'inline'); | });});', 'inline'); | ||
| − | + | ||
<div id="mySlideshow" class="slideshow"> | <div id="mySlideshow" class="slideshow"> | ||
<img src="1.png" /> | <img src="1.png" /> | ||
Revision as of 22:00, 4 March 2011
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');
?>
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');
?>
<a href="#">Section 1</a>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
<a href="#">Section 2</a>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
<a href="#">Section 3</a>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Be aware that the follwoing 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
};
};
--------------------------------------------------------------------