Difference between revisions of "JQuery"
From Blue-IT.org Wiki
(→cycle Plugin) |
(→Accordion Plugin) |
||
| Line 24: | Line 24: | ||
== Accordion Plugin == | == Accordion Plugin == | ||
| − | + | <nowiki> | |
<?php | <?php | ||
drupal_add_library('system', 'ui.accordion'); | drupal_add_library('system', 'ui.accordion'); | ||
| Line 40: | Line 40: | ||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> | ||
</div> | </div> | ||
| − | + | </nowiki> | |
| − | + | ||
== Be aware that the follwoing is no valid code. == | == Be aware that the follwoing is no valid code. == | ||
=== Only Snippets === | === Only Snippets === | ||
Revision as of 22:01, 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');
<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 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
};
};
--------------------------------------------------------------------