jQuery Plugins – AjaxScroll
Posted in AJAX, jQuery on 04/26/2009 07:24 pm by ycTINAjaxScroll is an lightweight jQuery plugins . Provided the ajax scollpane to replace the Next/Previous buttons, behaviour similar as MSN Image Search(Live.com Search).
Demonstration
Basic
Integrate Fullsize Plugins – (Fullsize Homepage)
Download
Version 0.1 – Download (full demo and source code)
Bugs
Please comment here if you found it, i will kill the bugs ^_^
Related posts:
- jQuery Plugins – CheckTree(ycTIN Edition) This edition is compatible with CheckTree, fixed some bugs and...
- jQuery Plugins – Month Picker Good user experience month selector, easily to choose the report...
- [PHP] Force download the files Some time you may want the user download the file...
- Best JavaScript IDE – Aptana Sutdio The Aptana Studio based on the Eclipse IDE, is a...
- jQuery Overview jQuery is a fast and concise JavaScript Library that simplifies...
(16 votes, average: 4.00 out of 5)
Loading ...
05/15/2009 at 10:32 PM
Hi,
thank you for your beautifull script : could I have some explanation about your code :
I have to display a list of data item from 0 to 1200, and I want to display them by blocks of 100 items when there are needed :
– how could I configure the batchNum, batchSize, maxOffset ?
– what are those variables for ?
Thank you for your help.
ycTIN Reply:
May 15th, 2009 at 11:33 PM
Hi Lek,
I explain the variables first.
maxOffset : the max number of items you wants to displays
batchNum : the number of sets will be append, when the scroll to bottom
batchSize : the number of items in each sets/blocks
you want diplay 0 ~ 1200, the maxOffset should be set to 1200
but the batchNum and batchSize, i can’t answer with you because its need consider scroll direction , the container and the items size
Regards,
Timmy
05/15/2009 at 11:56 PM
Hi Timmy,
thank you for your answer.
Here a some informations :
I want to use a vertical scroll
the container is a div with a total height of 200 px
the items are div lines with a total height of 12px
Does this informations help you ?
Thank you again for your help.
Regards,
Lek.
ycTIN Reply:
May 16th, 2009 at 12:30 AM
div lines = 1 item per row ? if so
batchSize = 200 px / 12px = i suggest 17~20 (the sum of items size should be lager than container window size)
batchNum = 5(default)
you can fine tune the values to get the best effect
05/16/2009 at 5:03 AM
All right,
thank you, it look cool. I have to play with it a little but I am very happy with the actual result.
Thanks for sharing & keep up the good work,
Regards,
Lek
05/21/2009 at 3:18 AM
Hello,
Can you please help me understand how to integrate “Fullsize”?
http://www.addfullsize.com/
I added the required ‘longdesc’ attribute to the ‘img’ tags, and I’ve tried adding the call to fullsize() in every place that I can think of, except for in your .js file… In my ‘head’, I’m pulling in ‘jquery-1.3.2.min.js’, ‘jquery.ajaxscroll.min.js’, and ‘jquery.fullsize.pack.js’, in that order…
Can you think of anything?
Thanks for sharing!
ycTIN Reply:
May 21st, 2009 at 9:30 PM
Hi Phoenix,
You can easily to integrate other image plugins because the AjaxScroll is i develop for my gallery project. Just need call the fullsize plugins in ajax callback function, more detail please find my updated post and download an new source code pack.
Regards,
Timmy
05/23/2009 at 9:20 AM
Awesome, ycTIN.
I actually just saw your new demo, before coming back here to read your reply…
What a nice surprise!
Thank-you so much
Respect ++
05/24/2009 at 3:28 AM
Hi, I like the idea of this. I am interested to know if you could get it to include asp pages, dynamic ones like .asp?xxxx, or if you could just include images from one folder.
Thanks
Richard
ycTIN Reply:
May 24th, 2009 at 11:07 PM
Hi richard,
I am not sure understand your question, but this sure can be dynamic loading any server side page. I using static html in the demo, because my hosting processing the php very slow. You can make few change to support any server side content(php,asp,jsp,cgi …)
Example
html:
$obj.load('vdata/' + $obj.attr('offset') + '.html');php:
$obj.load('data.php?offset=' + $obj.attr('offset'));asp:
$obj.load('data.asp?offset=' + $obj.attr('offset'));Regards,
Timmy
10/06/2009 at 5:57 PM
I like your demo and thinking of using this plug in, I’d like to display a list of jpeg, and every jpeg should have a link, so that when user click it, it will jump somewhere, possible? thanks.
ycTIN Reply:
October 6th, 2009 at 8:37 PM
Yes, you can do this. just need add the link into the image.
10/24/2009 at 10:29 PM
Great plugin and very responsive. Can you tell me how to change the number of columns in the vertical mode?
Thanks,
Esmond
10/24/2009 at 10:56 PM
I’ve worked out you just need to set the container size and let it flow so please ignore my last message
11/03/2009 at 3:10 AM
Hi, can u explain how I can use your script, if I have images in my DB and I show them dynamically on every website page? I can only use an ID of an image to exctract it from DB. So how can I use $obj.load(’show_image.php?offset=’ + $obj.attr(‘offset’)); if I have for example 10 images and their IDs are 10, 111, 200, 13, …, X.
The point is that in your script ‘offset’ is always a beautiful sequence of numbers from 1 to X, and in my case this sequence can be what ever it can be.
ycTIN Reply:
November 3rd, 2009 at 11:10 AM
Hi Konstantin,
In the SQL, you can locate you records by offset.
MySQL example: SELECT * FROM images WHERE album_id = 1 LIMIT $offset, 1
Regards,
Timmy
12/13/2009 at 9:09 PM
Hi!
to start, thank you for this nice scroll ! really usefull!
could you just tell me if it is possible to use several “ajaxscroll” (horizontal way) on the same page, one under the other?
actually i’d like to use it to make a picture portfolio, but I need to put several categories of photos on the same page (for instance: portraits, cars, landscapes …)
each different category using the 1 “ajaxscroll”…, how can I achieve this?
thanks!
ycTIN Reply:
December 17th, 2009 at 9:42 PM
Sure, you can do it. My demo also used two AjaxScroll in single page, you can download the demo source code and try to modify them.
Regards,
Timmy
12/28/2009 at 3:53 PM
hello,
Could you tell me how to use the script, if I have the datatable (as a datasource for the Grid needs continuous scrolling) with various fields which is formatted in JSon?
Regards,
Dat
01/14/2010 at 8:34 PM
thanx for code…
02/24/2010 at 10:53 PM
Hey,
Under what licence is this code released? Also, is there a non-1-line version available somewhere? (I’d like to have a better look at the exact code before using it.)
Cheers
02/25/2010 at 3:21 AM
Never mind the licence, it’s in the file, and I somehow missed it >_>
03/02/2010 at 4:32 AM
Hey Timmy,
Sweet little plugin dude! Think I maybe biting off more than I can chew so apologies if this seems amateur. Wondered if you, or anyone else would know how to pull in Wordpress posts, any idea what I should be adding?
Many thanks in advance,
Rob
03/28/2010 at 9:40 AM
Nice plugin, how to implement this plugin to wordpress ?
04/02/2010 at 10:31 PM
thank you it is very usefull, i will use that
04/14/2010 at 3:30 AM
Hi, congratulations by the plugin!
I have some question, maybe you can help me.
Scrollpane: width: 700px; height: 500px;
It box: width: 700px; height: 150px;
But, in each box there is a link that can extend the height of the box to 175px; Is it possible to use this plugin with “boxes” with variable height?
Also, I would like to use batchSize: 1 and batchNum: 1
But I am having some problems, probably because 1*1 => height=150px is lower than 500px (height of the container), right?
Thanks in advance!!!
04/14/2010 at 3:40 AM
Another thing, about that comment: “0 to 1200, and I want to display them by blocks of 100″
Dont you think the maxOffset should be set to 1200/100 = 12???
[]s
04/14/2010 at 4:30 AM
Sorry about the floody of comments, maybe you can try to join them.
I think I reproduce my problem in the basic_demo:
I change from this:
} #example_vertical {
height: 400px;
width: 700px;
}
To this:
} #example_vertical {
height: 400px;
width: 200px;
}
After this the loading stop working. I think it is dangerous to have a script fragile to layout changes.
Suggestion: Maybe the script could load dynamically the width and height of the elements.
Thanks in advanced e congratulations in the same way by this nice plugin!
05/25/2010 at 4:58 PM
Hi,How could i replace wp_pageNavi plugins with ajaxscroll?thanks!just email me!
09/14/2010 at 2:38 PM
Thanks for sharing!
09/17/2010 at 7:19 PM
what does updateEnd method do?
is there any possibility to stop making multiple calls, bcos when user scrolls down it makes multiple requests to the server even before the first one finished,
at a point I have seen it made 55 calls in one go, which is hammering my server, is there any way to stop it from making that many calls,
Adrina.
ycTIN Reply:
December 24th, 2010 at 9:22 PM
May be is your frame size problem. In normally only will make 2~5 requests as time.
Your can try to change the size of frame, or the scrollDelay and endDelay.
Hope this help.