Scratch that, madesome minor tweaks, new version is here: http://jsbin.com/isive
I also had to check for IE and change the easing method since that one looked a bit jerky in IE for some reason. On Oct 27, 2:00 pm, "c.barr" <[EMAIL PROTECTED]> wrote: > Thanks again guys. I ended up using ricardobeat's version since the > code actually fit my needs better - I needed it to go to exact sizes, > not to calculate the size on the fly. > > I removed the plugin functionality since I'm only using it once, and > when I posted my example without one imporant thing - I needed to > exclude one list item from this because of the way my page is > structured. > > So, here's my final versionhttp://jsbin.com/adipo > > On Oct 26, 1:10 am, ricardobeat <[EMAIL PROTECTED]> wrote: > > > Thanks Karl. That was actually stupidity of my part, that single > > replace() call must be slower than most of the script. Number also > > seems to be slower than parseInt on all modern browsers (despite being > > 6x faster on IE6) - I like the looks of Number(...) though :] > > > - ricardo > > > On 25 out, 20:54, Karl Swedberg <[EMAIL PROTECTED]> wrote: > > > > that looks great, Ricardo. I'm interested to hear why you chose to > > > write this: > > > > var normal = > > > Number(this.find('a:first').css('paddingLeft').replace('px','')); > > > > instead of this: > > > > var normal = parseInt(this.find('a:first').css('paddingLeft'),10); > > > > Is there an advantage to your line? I wouldn't have thought to write > > > it that way. > > > > --Karl > > > > ____________ > > > Karl Swedbergwww.englishrules.comwww.learningjquery.com > > > > On Oct 25, 2008, at 4:25 PM, ricardobeat wrote: > > > > > It's working again:http://jsbin.com/evodi/ > > > > > On Oct 25, 4:18 pm, ricardobeat <[EMAIL PROTECTED]> wrote: > > > >> In case Remy Sharp is reading this: > > > > >> jsbin is not working here.. when I try to save to a new URL, it goes > > > >> tohttp://edit/ > > > >> Also, pressing backspace results in lag, using delete doesn't. > > > > >> I turned your code into a plugin, and made some changes. Now you pass > > > >> an object with parameters and only need to specify an 'offset' in > > > >> padding, the values are calculated from the element's current > > > >> padding. > > > >> I tried hard to keep the overall width constant but it seems > > > >> impossible. Here's the code I ended up with (same html/css): > > > > >> (function($) { > > > > >> $.fn.shrinkHover = function(options){ > > > > >> var normal = > > > >> Number(this.find('a:first').css('paddingLeft').replace('px','')); > > > >> var length = this.find('li a').length; > > > > >> var opt = { size: 12, speed: 350, easing: "easeOutExpo"}; > > > >> jQuery.extend(opt,options); > > > > >> var large = normal+opt.size; > > > >> var small = normal-(opt.size/length), small = (small<0) ? 0 : > > > >> small; > > > >> var extra = Math.round( (small%1)*length ), small = > > > >> Math.floor(small); > > > >> large += extra; > > > > >> this.find('li').hover(function(){ > > > > >> //Mouse over > > > >> $(this).children('a').animate({ > > > >> paddingLeft: large, > > > >> paddingRight: large > > > >> },opt.speed,opt.easing).dequeue(); > > > > >> $(this).siblings('li').children('a').animate({ > > > >> paddingLeft: small, > > > >> paddingRight: small > > > >> },opt.speed,opt.easing).dequeue(); > > > > >> }, function() { > > > > >> // Mouse out > > > >> $(this).siblings().andSelf().children('a').animate({ > > > >> paddingLeft: normal, > > > >> paddingRight: normal > > > >> },opt.speed,opt.easing).dequeue(); > > > > >> }); > > > >> }; > > > > >> })(jQuery); > > > > >> $(document).ready(function(){ > > > > >> $('#subNavigation').shrinkHover(); > > > > >> }); > > > > >> cheers, > > > >> - ricardo > > > > >> On Oct 25, 2:28 am, "c.barr" <[EMAIL PROTECTED]> wrote: > > > > >>> Cool, I've never seen that site before. I made a small demo using > > > >>> my > > > >>> code above:http://jsbin.com/abuxe > > > > >>> Strangely enough it's not working properly, and that's a direct copy > > > >>> of what I wrote that works. Basically they are all shrinking, and > > > >>> the > > > >>> on your mouse is over does not get larger. Not sure what I've done > > > >>> wrong here. > > > > >>> Anyway, there's a 90% working demo... > > > > >>> On Oct 24, 9:58 pm, ricardobeat <[EMAIL PROTECTED]> wrote: > > > > >>>> Maybe you could post a working sample to jsbin.com, that would make > > > >>>> things a lot easier. > > > > >>>> On Oct 24, 4:00 pm, "c.barr" <[EMAIL PROTECTED]> wrote: > > > > >>>>> Hate to bump this, but it might get lost otherwise!