Snippets

Create an account or login to be able to add, comment and rate snippets.

Navigation

Refine Tags

Snippets tagged "visualeffect" Snippets tagged "visualeffect"

Div to toggle and remote

This helper used JavascriptHelper. It create a div which open a another onclick with a visual effect. The content of the div is the template's result of a call to a module/action.

/**
 * Fonction my_div_to_remote
 * @author Julien Levasseur
 * @since - 13 sept. 07
 * Extend of my_button_to_remote. return a div.
 * 
 * Returns an html button to a remote action defined by 'url' (using the
 * 'url_for()' format) that's called in the background using XMLHttpRequest.
 *
 * See link_to_remote() for details.
 *
 */
function my_div_to_remote($name, $options = array(),$effect, $html_options = array())
{
  return my_div_to_function($name, $effect, remote_function($options), $html_options);
}
 
function my_div_to_function($name,$effect, $function, $html_options = array())
{
  $html_options = _parse_attributes($html_options);
  $html_options['onclick'] = $function.';'.$effect['onclickadd'].';return false;';
  return content_tag('div', $name, $html_options);
}
 

Example:

<?php echo my_div_to_remote('div de test',array('url'=>'principal/pret'),array('onclickadd' => visual_effect('toggle_blind', 'rem', array('duration' => 4.0))),array('style'=>'border: solid 1px;width:40px;height:40px;')) ?>
    <div id="rem" style="display:none;height:300px;border:solid 1px;">youpi</div>
 
by julien levasseur on 2007-09-14, tagged ajax  div  link  remote  toggle  visualeffect 

visual_effect('highlight') transition colors / visual_effect parameters

(note: you can look up the options for the other various visual_effects from the script.aculo.us wiki tags page. Their usage is identical to this example.)

visual_effect('highlight', 'vendor',
array('startcolor' => "'#000000'", 'endcolor' => "'#ffffff'", 'restorecolor' => "'#FF0000'")))

simple, but has a few caveats:

-if you dont enclose the quotes with the color params, the js function color isnt quoted, and the highlight wont occur.

-i found behavior inconsistent without using 6 character RGB values (e.g., #000 didnt work).

-restorecolor can be omitted, but non web-safe colors wont always be restored to the original background color.

passing an options array works for any of the visual_effect() aliases.

by eric williams on 2006-07-07, tagged ajax  highlight  scriptaculous  visualeffect