Sorry but I took some liberties with your code. Hopefully that is ok.
http://www.exfer.net/test/jquery/tabslide/
I'd be interested to know if that is more like what you wanted.
David
On Oct 16, 9:41 am, Karl Swedberg <[EMAIL PROTECTED]> wrote:
> Hi David,
>
> I tried something like that earlier, but if I land on a tab that I
> want opened while another tab is animated, I'll have to move out and
> then back over the tab for it to trigger. I still believe that there
> is some magic in those other methods (queue, etc.), but I haven't
> found it yet.
>
> --Karl
>
> On Oct 16, 2007, at 11:21 AM, David Serduke wrote:
>
>
>
>
>
> > I suggest you change Oliver's check to see if ANY of the panels are
> > animating.
>
> > if ($this.parent().siblings().children().filter(':animated').length ==
> > 0) {
>
> > I think that will give similar functionality to the original. Not
> > that it is ideal since in the mootools version you can move over a
> > panel and move back quickly (while it is still animating) and end up
> > pointing at a closed menu while the open one is not closed. That will
> > change as soon as you move the mouse though so perhaps it isn't so
> > awful.
>
> > David
>
> > On Oct 15, 5:47 pm, Karl Swedberg <[EMAIL PROTECTED]> wrote:
> >> Olivier,
>
> >> You're right! Thanks a lot for the suggestion.
>
> >> When I tested in Firebug, it didn't look like there were a lot of
> >> "before" logs firing without the "after" logs, but even having it
> >> happen just a few times warrants the extra ":animated" condition in
> >> there.
>
> >> Thanks again for testing and contributing! Much appreciated.
>
> >> --Karl
> >> _________________
> >> Karl Swedbergwww.englishrules.comwww.learningjquery.com
>
> >> On Oct 15, 2007, at 4:29 PM, Olivier Percebois-Garve wrote:
>
> >>> Hi
> >>> although there is many things unclear to me in animations,
> >>> ":animated" seems to work right.
>
> >>> I suggest the addition of a case around the code in your
> >>> slideTabs() function : if (!$this.next().is(':animated'))
>
> >>> With console.log(), I noticed that over events are being fired
> >>> far more often than necessary.
> >>> Using your menu, where button are pretty small, I have normally
> >>> the over event being fired 2 times
> >>> when the tab slides up only one time. On mine with bigger buttons
> >>> its even more.
> >>> I found it important to reduce the number of events as low as the
> >>> strict necessary, because cpu/memory
> >>> use can increase drastically, when doing mad mouse moving, when
> >>> animation are chained or/and when they
> >>> run on multiple elements
>
> >>> -Olivier
>
> >>> var slideTabs = function() {
> >>> var $this = $(this);
> >>> console.log('before-');
> >>> if (!$this.next().is(':animated')){
> >>> resetClose();
> >>> console.log($this);
> >>> console.log('-after');
> >>> $this.parent().siblings().children('div.panel_body')
> >>> .animate({height: 'hide'}, 300, function() {
> >>> $(this).prev().removeClass('visible');
> >>> });
>
> >>> if (idle == false) {
> >>> $this.next(':hidden').animate({height: 'show'}, 300,
> >>> function() {
> >>> $(this).prev().addClass('visible');
> >>> });
> >>> }
> >>> }
> >>> };
>
> >>> Karl Swedberg wrote:
> >>>> Hi everyone,
>
> >>>> Someone asked me to try to replicate something he saw here:
> >>>>http://www.andrewsellick.com/examples/tabslideV2-mootools/
>
> >>>> It looked pretty straightforward, and I was able to reproduce the
> >>>> main effect pretty easily -- except that the Moo tools one looks
> >>>> better because it doesn't try to slide up every tab when the mouse
> >>>> goes quickly over a number of them. You can see the problem with
> >>>> mine here (note, I changed the photo and tab colors to protect the
> >>>> innocent):
> >>>>http://test.learningjquery.com/tabslide/
>
> >>>> I know this little problem can be resolved with the hoverIntent
> >>>> plugin, but I'd like to gain a better understanding of the new
> >>>> animation methods in jQuery 1.2, and I thought that one of them
> >>>> would help, but I can't quite get things to work. I tried various
> >>>> combinations of .queue() and .dequeue() and .stop(), but nothing
> >>>> worked right.
>
> >>>> So here is what I have now. As you can see, I also tried using the
> >>>> new :animated selector, and that almost worked, but not quite
> >>>> (which is why it's commented out now):
>
> >>>> $(document).ready(function() {
> >>>> var $panelBodies = $('div.panel_body');
> >>>> $panelBodies.slice(1).hide();
> >>>> var slideTabs = function() {
> >>>> var $this = $(this);
> >>>> $this.parent().siblings().children('div.panel_body')
> >>>> .animate({height: 'hide'}, 300, function() {
> >>>> $(this).prev().removeClass('visible');
> >>>> });
> >>>> // if ($panelBodies.filter(':animated').length < 2) {
> >>>> $this.next(':hidden').animate({height: 'show'}, 300,
> >>>> function() {
> >>>> $(this).prev().addClass('visible');
> >>>> });
> >>>> // }
> >>>> };
>
> >>>> $('div.panel_container > h3').mouseover(slideTabs);
> >>>> });
>
> >>>> Can anybody help this poor lost boy?
>
> >>>> thanks,
>
> >>>> --Karl
> >>>> _________________
> >>>> Karl Swedberg
> >>>>www.englishrules.com
> >>>>www.learningjquery.com-Hide quoted text -
>
> >> - Show quoted text -- Hide quoted text -
>
> - Show quoted text -
