PDA

View Full Version : Virtual Pagination Image Pagination



Pamps
06-05-2007, 04:53 PM
1) Script Title: Virtual Pagination script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/virtualpagination.htm

3) Describe problem:

Hi,
I am trying to use images instead of text to paginate.

I think i have to work based on
gallery.buildpagination("galleryselect", ["castle", "park", "harvest", "country"])
but i do not know how to handle it to use images instead of the text.

I try also to look at :
<a href="javascript:eg1.showpage(0)">Go to first page of this paginated content</a>

this function seems what i need cause i can change text inside <a> for an image and could put <a href="javascript:eg1.showpage(0)">IMG0</a>,<a href="javascript:eg1.showpage(1)">IMG2</a>, <a href="javascript:eg1.showpage(2)">IMG2</>.....

but could not see how to implement it.

Maybe i am missing some point here but can u help me on this.
Many thanks,
Pedro

ddadmin
06-06-2007, 03:45 PM
You can just enter an image tag in place of text inside the custom text array, for example:


gallery.buildpagination("galleryalt", ["<img src=1.gif' />", "<img src=2.gif' />", "<img src=3.gif' />"])

Be sure to remove the CSS declarations at the top of the page that target the pagination links, since you're using images now. Also, this works only for the "Flat View" pagination interface, and not the SELECT menu, obviously.

Note that you can also create links manually that go to a specific page, for example:


<a href="javascript:eg1.showpage(0)"><img src="1.gif" /></a>

pecanhouse
11-14-2009, 02:22 AM
I have addon to this script it would be good to add it as a varible but i don't know how yet so I hard coded it.


virtualpaginate.prototype.paginate_build_regularlinks=function(paginatelinks){
var instanceOfBox=this
for (var i=0; i<paginatelinks.length; i++){
var currentpagerel=paginatelinks[i].getAttribute("rel")
if (/^(previous)|(next)|(first)|(last)$/.test(currentpagerel)){ //screen for these "rel" values
paginatelinks[i].onclick=function(){
if (this.currentpage != 0){
window.location = "#top"}
instanceOfBox.navigate(this.getAttribute("rel"))
return false
}
}
if (currentpagerel=="previous" || paginatelinks[i].href.indexOf("previous")!=-1){ //check if this is a "previous" link
if (!this.wraparound && this.currentpage==0) //if current page is first page, disable "prev" link
virtualpaginate.setcssclass(paginatelinks[i], "disabled", "add")
this.prevlinks.push(paginatelinks[i])
}
else if (currentpagerel=="next" || paginatelinks[i].href.indexOf("next")!=-1){ //check if this is a "next" link
if (!this.wraparound && this.currentpage==this.pagecount-1) //if current page is last page, disable "next" link
virtualpaginate.setcssclass(paginatelinks[i], "disabled", "add")
this.nextlinks.push(paginatelinks[i])
}

}
}
if (this.currentpage != 0){window.location = "#top"}
this is the line it jumps to a html anchor when clicked next but not on the first page.