This is probably a stupid or odd question but I was wondering if there was a way to force just the gallery section to reload instead of whole page when scrolling through pictures. The theme I am using has a fairly large picture in the header and when ever I hit next in the gallery the page jumps to the top when reloading. With higher resolution screens it still shows a partial picture and access to the next back buttons but if someone has their screen set to lower resolution they have the scroll down to get to the picture and next/back buttons again. I was wondering if there was a way to either keep the whole page from reloading or if there was a way to cause the page to reset to the photo area and not the top?
Comments
This is "expert" level implementation, though.
Your other option is to use the dreaded iFrames and force refresh of the frame. Still will require javascript, though.
Add an empty anchor before the image, or where you want the page jumps on load when linked from prev and next buttons.
``
Then add this javascript to your image.php file:
`
$(document).ready(function(){
var anchor1 = $('#next a').attr('href');
var anchor2 = $('#prev a').attr('href');
anchor1 = anchor1+'#myAnchor';
anchor2 = anchor2+'#myAnchor';
$('#next a').attr('href',anchor1);
$('#prev a').attr('href',anchor2);
});
`
- Preloading
- Linkability of each image (not unimportant
- Possible rebinding other JS functionality to each image (colorbox, rating etc) that would not work the elements addressed are loaded via Ajax.
All is possible. For example you could use the Cycle jQuery plugin that powers our slideshow to set this up. There are of course other jQuery tools that can do this.
@bic: That might work indeed.
Maybe I'll implement it on my site too, probably under a conditional statement like this:
`if (screen.height < 800){...}`