[Phpmyadmin-devel] Animation in sliders

Rouslan Placella rouslan at placella.com
Tue Jun 21 22:57:50 CEST 2011


On Tue, 2011-06-21 at 12:51 -0400, Marc Delisle wrote:
> Piotr Przybylski a écrit :
> > 2011/6/16 Marc Delisle <marc at infomarc.info>:
> >> Piotr Przybylski a écrit :
> >>> 2011/6/16 Rouslan Placella <rouslan at placella.com>:
> >>>> Hi there,
> >>>>
> >>>> I've added some animations to the routines functionalities in my branch
> >>>> and I'm just looking for your opinions about this. A demo video is
> >>>> available on my site [1]. Please let me know if you think that it's too
> >>>> much eye-candy or if you think that it's OK. I didn't check this into my
> >>>> repo yet and I'm keeping the code in my git-stash.
> >>> Personally, I don't like the table jumping up and down. Moving objects
> >>> attract attention, especially if a large part of the screen moves, and
> >>> in this case it looks like an effect done because it can be done.
> >>> Space above Routines table should expand / contract to proper height
> >>> in one move - it it needs two, then the effect stops looking nice, it
> >>> becomes annoying.
> >>>
> >>> If it can't be done, it would look nice with old content replaced by
> >>> new with 0 opacity and using fade in to show it.
> >>>
> >>> (Note - I can be prejudiced, I hate collapsible options in PMA because
> >>> the animation used there is just wrong imo)
> >>>
> >> Piotr,
> >> feel free to suggest another animation.
> >>
> > 
> > After looking at it closely, I realized what bothers me in this case -
> > 'clip' effect looks like two animations mixed up due to hidden panel
> > being vertically centered - 'blind' and moving it at the same time,
> > making it impossible to focus on what is being shown. Plain 'blind'
> > would be the best, but is painfully slow due to reflows of all content
> > below, so maybe a 'blind' that reserves space for box in the same way
> > as 'clip' does (so that content below it is moved only once).
> > 
> Piotr,
> 'slide' instead of 'clip' seems to work well.

Since my branch was merged with master, these sliding animations are now
available for everyone to use. If anyone wants to use them, it's really
simple. First merge with master (I pushed a bugfix to this functionality
recently). Then, from JavaScript, call PMA_slidingMessage() with the
message to display as the first argument. Typically this would happen
from an AJAX request, so the call might look like:

PMA_slidingMessage(data.message);

This will show the message just below the navigation links in the right
frame. Or, to show the message somewhere specific on the page, one might
do the following:

PMA_slidingMessage(data.message, $('#myDiv'));

If, in this case, #myDiv does not exists, then the message will be shown
in the default location. If the target element for the animation,
whether specified or implied, already contains a message, it will be
faded out and replaced. Empty messages are not allowed.

Bye,
Rouslan





More information about the Developers mailing list