ProDevTips - Latest Comments in jQuery - making scrolling and toggling simple

Re: jQuery - making scrolling and toggling simple

bhaarat — Wed, 12 Dec 2007 13:32:24 -0000

How about a demo about 'load on scroll' or 'pageless scrolling'

example at www.dzone.com and just try to scroll down on the page. pretty neat!

Re: jQuery - making scrolling and toggling simple

Ariel Flesler — Fri, 07 Dec 2007 07:48:47 -0000

Oops.. I mean '.' + klass. Not '#' + klass.

Re: jQuery - making scrolling and toggling simple

Ariel Flesler — Fri, 07 Dec 2007 07:47:52 -0000

@dave
If you use hasClass, you must remove the dot leading the className. As for speed.. that is odd, because if you take a look at hasClass:

hasClass: function(expr) {
return this.is("." + expr);
},

It's doing, internally, the same as I did. I don't think it can be really faster. hasClass is useful when you have the className in a variable, so it saves you the '#' + klass .

Re: jQuery - making scrolling and toggling simple

prodevtips — Fri, 07 Dec 2007 02:19:23 -0000

Thanks Dave!

Rich: I will link to that whole project when it is finished. In the meantime what we do here is simply making the main browser window scroll to make the element clicked centered vertically. The purpose is to enhance the usability of the interface.

Re: jQuery - making scrolling and toggling simple

Rich — Thu, 06 Dec 2007 15:47:09 -0000

Can you post a demo of effect you are doing?

Thanks,
Rich

Re: jQuery - making scrolling and toggling simple

dave mcfarland — Thu, 06 Dec 2007 12:11:47 -0000

If you're using jQuery 1.2.1, you can use the hasClass() method instead of is() so you could re-write part of Ariel's code from:

!$el.is(’.hidden_simple')

to

!$el.hasClass(’.hidden_simple')

I ran a few very basic speed tests and found the hasClass() method to be about 30% faster.

Re: jQuery - making scrolling and toggling simple

prodevtips — Thu, 06 Dec 2007 09:05:47 -0000

I think the problem was that I looked to dimensions before I found scrollto ,therefore I knew I could get the position of an element with dimensions and that made me not review your stuff like I should have it seems. I think everything is clear enough, thanks for an awesome plugin!

Re: jQuery - making scrolling and toggling simple

Ariel Flesler — Thu, 06 Dec 2007 08:08:47 -0000

Indeed.. since the... third release, more or less. The plugin stopped relying on dimensions.
If you are interested, that function could be shorter written like this:

function toggleViz(el_id){
var $el = $("#"+el_id).toggleClass("hidden_simple");
if ( !$el.is('.hidden_simple') )
$.scrollTo( $el, {speed:500});
};

I do admit the examples don't show all the possible uses of the plugin. But the source code has some more examples and explains each customizable option too.
Please let me know, if you think it's not clear enough, thanks.

Re: jQuery - making scrolling and toggling simple

prodevtips — Wed, 05 Dec 2007 23:37:20 -0000

Awesome Ariel, I didn't see that one in your example (didn't look very hard though). So I suppose we can throw out the dimension plugin in this example.

Re: jQuery - making scrolling and toggling simple

prodevtips — Wed, 05 Dec 2007 22:55:09 -0000

The <a href="javascript:toggleViz('{$feed.id}')" rel="nofollow">more stuff could probably be implemented with some kind of callback event functionality. It's on my to do list.

Re: jQuery - making scrolling and toggling simple

Ariel Flesler — Wed, 05 Dec 2007 09:03:02 -0000

Hi, doesn't this work as expected ?

function toggleViz(el_id){
$("#"+el_id).toggleClass("hidden_simple");
if($("#"+el_id).attr("className") != "hidden_simple"){
// see the modification here V
$.scrollTo( "#"+el_id, {speed:500});
}
}