Can anyone help me with the overall philosophical approach to one of the Single Page Website example pages? Namely, the horizontal scrolling example ... http://www.artifaction.nl/

Roughly, how do I turn my vertical page into something that works horizontally instead? I am putting some time into Firebugging the website above, but it still isnt clear to me where the magic comes in.

Cheers!

CommentFileSizeAuthor
#1 scroll.txt5.01 KByaremchuk

Comments

yaremchuk’s picture

StatusFileSize
new5.01 KB

First of all, we have to admit that Ramon did really magic site!

But we can understand magic if we will find difference in
http://www.artifaction.nl/sites/all/modules/single_page_website/js/scrol...

and this file from the official release.

First of all we should use

.animate({scrollLeft:

instead

.animate({scrollTop:

Also please take a look on the attached file. It is some not final version of scroll.js from artifaction.nl
kindly provided by Ramon.

take a look here

		//get the top offset of the target anchor
		var target_offset = $("#"+trgt.replace(" ", "_")).offset();
		var target_width = $("#"+trgt.replace(" ", "_")).width();
		var target_top = target_offset.left;
		//window.location.hash = "#"+trgt.replace(" ", "_");
		//goto that anchor by setting the body scroll top to anchor top
		var window_width = $(window).width();
			target_top = target_top -(window_width - target_width)/2;
		$('html, body').animate({scrollLeft:target_top}, 700);

We use width instead height like in vertical scroll case.

Please let me know if this description in not enough.

clecioespindola’s picture

I tried that but when a change the code of scroll.js file the scroll don't work.
Any help?

yaremchuk’s picture

we start working on horizontal scroll feature

HerrThomas’s picture

Hey

I was thinking of implementing a single page website. But instead of scrolling just vertical or horizontal, I want to combine both. Do you know if this is (in theory) possible with this module by extending the code?
(if I succeed, I will provide the code)

Thanks

hysterik’s picture

Hello everyone !

Is there any update on the horizontal scrolling feature for the Single Page Website module ?
I cannot find a way to make it work.
As said previously, as soon as I try to change something in the scroll.js file, nothing is scrolling anymore.

Thanks.

j4’s picture

hi any progress on the horizontal scroll? Thanks!