View Full Version : Virtual pagination edit

07-31-2011, 04:34 PM
1) Script Title: Virtual pagination V2.1

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

3) Describe problem: Need to adjust size of container
both CSS and image edit were unsuccessfull.

Test installation (http://check-for-it.com/vpagin/index.php)

07-31-2011, 09:11 PM
Try changing the numbers in the paragraph highlighted in red. That should change the size of the container.

<!-- Virtual Pagination Demo 4 -->
<h3>Demo 4 (shows "flatview" pagination interface with custom text defined):</h3>

<div style="width: 450px; height: 350px;">

<div class="virtualpage4 hidepiece">
<img src="http://img25.imageshack.us/img25/8442/castlei.gif width="450" height="300" />

<div class="virtualpage4 hidepiece">
<img src="http://img201.imageshack.us/img201/7907/streetkz4.gif" />

<div class="virtualpage4 hidepiece">
<img src="http://img201.imageshack.us/img201/8538/weedjh8.gif" />

<div class="virtualpage4 hidepiece">
<img src="http://img201.imageshack.us/img201/6923/countryxb6.gif" />


08-01-2011, 02:37 AM
It appears that the div does change in size , but perhaps being virtual it is not seen

the images do not appear to be resized

08-01-2011, 11:18 AM
Some resolving
I did not realize this may be a universal problem but
Images will not be re-sized if they are not hosted in the same location

same server,
same folder

08-01-2011, 04:51 PM
Why not just give your images explicit width/height attributes to control their dimensions as desired?

08-02-2011, 03:48 AM
Good suggestion

More discovery.
Need to replace the text links with images

Created a folder with the images in it
the virtualpaginate.js has been edited

var imgdir = './images/'; //path to images directory (notice the trailing slash)

and initialize script

<script type="text/javascript">

var gallery4=new virtualpaginate({
piececlass: "virtualpage4",
piececontainer: 'div',
pieces_per_page: 1,
defaultpage: 0,
wraparound: false,
persist: true

gallery4.buildpagination(["galleryalt"], ["castle.jpg", "park.jpg", "harvest.jpg", "country.jpg"])


Is there some other adjustment required , Or is there a syntax error somwhere?

test installation (http://check-for-it.com/vpagin/index.php)

08-03-2011, 02:27 PM
using rel url for img locations

How/where can the original boxes for the text links be removed?

thank you

test install (http://check-for-it.com/vpagin/index.php)

08-04-2011, 08:01 AM
Just use CSS. The pagination links, in this case, thumbnail images, are dynamically added inside the SPAN element:

<span class="flatview"></span>

So to get rid of the default image border, in your CSS, you can do something like:

span.flatview a{

08-04-2011, 05:00 PM
Thanks John
All images are of different sizes and from different locations
I would like to have them all render at the same size.
to avoid having to edit each one individually, as there are scores of them
I have tried unsuccessfully to set all images in CSS, but something's still missing

.img {
width: 500px;
height: 400px;

and my eyes will not tell me what it is

Assistance appreciated

thank you

09-14-2011, 12:58 PM
Does anyone have some insight as to where the edits are made
I have tried both the CSS

.img src {

width: 500px;

height: 400px;

and the div

<div style="width: 550px; height: 450px;">

but no joy..