Next image down button

Mar 24th, 2019 at 05:58 AM
User 2879688 Photo

Citrus
Registered User
201 posts

Hi Cuppers
I have a page with vertically aligned single images on on top of the other. I’m trying to sort out a button that will go to the next image down (or up even). I don’t want to use sliders or galleries; just really not necessary. I have a top of the page Magellan that works fine. Perhaps something down those lines?
T.

Maybe a lemon today?
Jazz isn't dead it just smells funny!
Mar 24th, 2019 at 06:17 AM
User 2879688 Photo

Citrus
Registered User
201 posts

Apologies. The ‘top of page’ but is ‘smooth scoll’ : )
Thanks T.
Jazz isn't dead it just smells funny!
Mar 24th, 2019 at 07:48 AM
User 187934 Photo

Eric Rohloff
Senior Advisor
20,271 posts

Hi Citrus,
Can you share a link so we can see the html structure.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
Mar 24th, 2019 at 10:25 AM
User 2879688 Photo

Citrus
Registered User
201 posts

Hi Eric
thanks for the reply
I was looking at this website. Not my own... but wanted to use the layout.
http://www.karen-newman.com/works/
just to make this clear; im not looking at the existing sliders on each item.
so imagine there are no sliders on this website at all...
as you can see the each sculpture is stacked one on top of the other.
What i was looking for was a next button to go down to the next sculpture below.
(next to the existing top of page button...)
Hope thats clear
Thanks T.
Jazz isn't dead it just smells funny!
Mar 24th, 2019 at 01:36 PM
User 187934 Photo

Eric Rohloff
Senior Advisor
20,271 posts

Yes, I understand the need but I need to see your html to make a script for your button.
Do you have a page with the images on it?
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
Mar 24th, 2019 at 03:56 PM
User 2879688 Photo

Citrus
Registered User
201 posts

Hi Eric
Ive attached a SD 3.5 zip file hope thats what you were asking for : )
T.
Attachments:
Jazz isn't dead it just smells funny!
Mar 24th, 2019 at 08:58 PM
User 187934 Photo

Eric Rohloff
Senior Advisor
20,271 posts

I made an example for proof of concept. I didn't look at your file yet but wanted to make sure we're headed the correct direction.
https://ericrohloff.com/coffeecup/ccfor … ge-scroll/
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
Mar 25th, 2019 at 03:36 AM
User 2879688 Photo

Citrus
Registered User
201 posts

Fantabulouse : )
..... hit the nail on......
Parfait
Cool.....

Thanks
Jazz isn't dead it just smells funny!
Mar 25th, 2019 at 01:17 PM
User 187934 Photo

Eric Rohloff
Senior Advisor
20,271 posts

Paste the code below into your custom jquery scripts in the footer on the page management tab.
Adjust the 7 to the actual number of photos you'll be using.
Give your button or what ever your using to fire the scrolling a class of link-button.
Adjust the -56 number to adjust the scroll offset. I made mine -56 to make the scroll be just below the button. it can be + or -. It can be removed if not needed.
Give each image an ID of photo1, photo2, photo3, etc for as many as you have.
<script>
// ** ver 1
var count = 0;
$(document).ready(function(){
$('.link-button').on('click', function(e) {
e.preventDefault();
count++;
var countNum = count;
if(count ==7){
count = 0;
}
$('html, body').animate({ scrollTop: $('#photo' +countNum).offset().top-56 }, 1000);
;})
});
</script>
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
Mar 25th, 2019 at 01:35 PM
User 2879688 Photo

Citrus
Registered User
201 posts

Thanks Eric
If I could by you a beer I would.
That’s brilliant. Like the twist at the end that takes you back to the top.
Thanks again
Tim
Jazz isn't dead it just smells funny!

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.