Smotth Menu Scroll Out

GTPeter · January 14, 2013, 4:45pm

I hope the question is allowed :o).

How can a smooth scroll out be done?
Accordeon doesn’t do the job the way it should be.

Any help or an action would be very appreciated!

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

GTPeter · January 17, 2013, 7:18am

Solved.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Ernie_Simpson · January 17, 2013, 10:38am

but how? Plz share.

–
Ernie Simpson

On Thu, Jan 17, 2013 at 2:18 AM, TP email@hidden wrote:

Solved.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

seoras · January 17, 2013, 10:56am

hope the question is allowed :o).

Likewise the answer.

s

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

David2 · January 18, 2013, 2:55am

Solved.

Don’t leave us in suspense… What was the answer?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Ernie_Simpson · January 18, 2013, 3:59am

Here’s how I did it on this site:
http://portfolio.thebigerns.com/cv-resume/index.html

Here’s the javascript for it. Requires jquery. I hope I’ve got this
goat-hub thing right…

github.com

TheBigErns/cssway/blob/master/smooth.js

$(document).ready(function() {
   $('a[href*=#]').bind('click', function(e) {
  e.preventDefault(); //prevent the "normal" behaviour which would be a "hard" jump
       
	var target = $(this).attr("href"); //Get the target
			
	// perform animated scrolling by getting top-position of target-element and set it as scroll target
	$('html, body').stop().animate({ scrollTop: $(target).offset().top }, 1000, function() {
	     location.hash = target;  //attach the hash (#jumptarget) to the pageurl
	});
			
	return false;
   });
});

Love to compare Tom, everybody benefits from it.

–
Ernie Simpson

On Thu, Jan 17, 2013 at 9:55 PM, David email@hidden wrote:

Solved.

Don’t leave us in suspense… What was the answer?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

tonzodehoo · January 18, 2013, 8:46am

On 18 Jan 2013, 3:00 am, The Big Erns wrote:

Here’s how I did it on this site:
Thebigerns.com

Hello Ernie, Hope you don’t mind me cutting in here.

Really like the page at your link. Content and all!

Is there a way to separate out the header so that the content scrolls behind this?
I was thinking that maybe the same effect could be achieved using the scrolling layer set of actions but I was wondering what the difference is in doing it the way you have?

Cheers

Anthony

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Ernie_Simpson · January 18, 2013, 1:55pm

On Fri, Jan 18, 2013 at 3:46 AM, tonzodehoo email@hidden wrote:

Is there a way to separate out the header so that the content scrolls
behind this?

Do you mean like this? thebigerns.com

Fixing the header or any other element is as simple as position:fixed.
Sort of. There’s no one solution and I’ve been told that cv page looks
horrible in ancient browsers.

The truth is I spend less time on my own pages than I do on anyone else’s.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

tonzodehoo · January 18, 2013, 2:09pm

Thanks for getting back to me.

Yes indeed thats somewhere along the lines of what I was thinking.
Were these pages put together in freeway? Is it doable without too much extra coding?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

waltd · January 18, 2013, 2:35pm

IE < 7 can’t handle position:fixed at all. There’s a way to shim it with position:absolute and a bunch of JavaScript, but the result is jerky and awful. Have a look inside the Sticker Action for a canonical example of that.

But it’s well past time to quit worrying about IE 6.

Walter

On Jan 18, 2013, at 8:55 AM, Ernie Simpson wrote:

I’ve been told that cv page looks
horrible in ancient browsers.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Ernie_Simpson · January 18, 2013, 4:13pm

I want to say those pages were generated by Freeway Pro, but the truth is
those pages were generated by my understanding of how Freeway Pro works.

That may not be a distinction very many people can make, but I think it an
important one.

–
Ernie Simpson

On Fri, Jan 18, 2013 at 9:09 AM, tonzodehoo email@hidden wrote:

Thanks for getting back to me.

Yes indeed thats somewhere along the lines of what I was thinking.
Were these pages put together in freeway? Is it doable without too much
extra coding?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

GTPeter · January 19, 2013, 11:21am

Ernie, thanks for your answer. I made it wir accordion. They come out ok, but when I hoover the second time they wont scroll out. Thought I have had the solution… but it wasn’t as good as it could be… I’ll try it again.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Ernie_Simpson · January 19, 2013, 3:17pm

You’re welcome to try my solution Tom,

All is required are two script links inserted into the page markup before
/head – first one is a link to jquery and the second to the smooth.js
file which I uploaded with the Upload Stuff action. If you look at the
source of my example page, you can copy the two links verbatim. Download
the smooth.js from my github link, and use the Upload Stuff action to
upload it beside your page. Should work as well for you as me.

–
Ernie Simpson

In the dwindling hours of the 17th day of the first month in 2013, Ernie
Simpson, aka The Big Erns email@hidden doth wrote:

Here’s how I did it on this site:
Thebigerns.com

Here’s the javascript for it. Requires jquery. I hope I’ve got this
goat-hub thing right…

https://github.com/TheBigErns/cssway/blob/master/smooth.js

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

GTPeter · January 28, 2013, 6:07pm

I am still working on it. But I think I dont get it right… I do not know an Upload stuff action… You mean extra ressources?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

GTPeter · January 28, 2013, 6:11pm

Sorry Big E. found the action.

So I set the links to before /head and shot then the smooth.js to html (not to ressources), right?

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Ernie_Simpson · January 28, 2013, 6:56pm

On Mon, Jan 28, 2013 at 1:11 PM, TomP email@hidden wrote:

So I set the links to before /head and shot then the smooth.js to html
(not to ressources), right?

Yes, that sounds about right.

If you upload the smooth.js file to the Resources folder, then your /head
code should be changed reflect that location. My opinion is the html
location is just fine – you can change it later if you feel strongly one
way or the other.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options