Skip to content
This repository has been archived by the owner on Apr 28, 2020. It is now read-only.

Documentation Request #43

Closed
dgoodale opened this issue Feb 27, 2014 · 8 comments
Closed

Documentation Request #43

dgoodale opened this issue Feb 27, 2014 · 8 comments

Comments

@dgoodale
Copy link

Would it be possible to update the documentation to include a working example of calling a smooth scroll event using javascript?

I have been trying to implement a fairly simple javascript function that fires when a drop down box is changed. When the user changes the drop down box, I want the page to smoothly scroll down to a predetermined anchor tag.

From within my javascript function I have tried using this:

smoothScroll.animateScroll(anchor: '#bazinga');
or
smoothScroll.animateScroll(anchor, '#bazinga');
or
smoothScroll.animateScroll('anchor: #bazinga');

I have tried several different ways and cannot get the syntax correct. I apologize if this problem is just due to the fact that I find javascript tricky. However, I think potentials users of the script could do with a few more demos.

Thank you, all the best.

@cferdinandi
Copy link
Owner

Hi there! So you're passing your variables in as if it's an object, when it should be passed in as a simple argument. You're also passing in your anchor variable where animateScroll expects to see the link that toggled the scrolling action.

You'd want this: smoothScroll.animateScroll( null, '#bazinga' );

@cferdinandi
Copy link
Owner

I should also mention, if you wanted to change things like easing or scroll speed, you'd additionally pass in the options object:

var settings = { speed: 1000, easing: 'easeOutCubic' };
smoothScroll.animateScroll( null, '#bazinga', settings );

@cferdinandi
Copy link
Owner

@dgoodale - Thanks for the suggestion on updating the docs. I just added a few examples, and will be doing so for my other scripts as well. Cheers!

@dgoodale
Copy link
Author

Thank you very much for getting back to me so quickly and helping. It's
greatly appreciated!

David Goodale


From: Chris Ferdinandi [mailto:notifications@github.com]
Sent: Thursday, February 27, 2014 5:33 PM
To: cferdinandi/smooth-scroll
Cc: dgoodale
Subject: Re: [smooth-scroll] Documentation Request (#43)

@dgoodale https://github.com/dgoodale - Thanks for the suggestion on
updating the docs. I just added a few examples, and will be doing so for my
other scripts as well. Cheers!

Reply to this email directly or view
<#43 (comment)
4> it on GitHub.
<https://github.com/notifications/beacon/6801220__eyJzY29wZSI6Ik5ld3NpZXM6Qm
VhY29uIiwiZXhwaXJlcyI6MTcwOTA3MzE2OSwiZGF0YSI6eyJpZCI6MjY1NjI5MDZ9fQ==--019d
f0fd54192d527233adcd102838e19fb5cf54.gif>

@dgoodale
Copy link
Author

Hi Chris,

I tried to use the code suggestion you gave me and I'm still getting an
error. It's a pretty simple script, so I'm not sure what could be causing
the problem.

I have the smooth scroll javascript loaded and working properly with a
normal click. (www.beanbagchairs.ca/2014/buynowOnLeft.php). You can see
the clickable "Anchor Link" right at the top of the page. If you click it,
it works perfectly.

But I want to launch it from a javascript event. It's a really simple one.

  1.   On the page, on the top left hand side I have a drop down box to
    

choose a quantity of black chairs.

  1.   onchange it calls my javascript function that triggers the
    

smoothscroll event. Here is the function:

function dropdownChange() {

alert('going to scroll');

smoothScroll.animateScroll( null, '#bazinga' );

}

--- I know it works because the alert box that comes up and says "going to
scroll". However, no scroll happens. Using the webdeveloper tool in
Firefox it says this:

TypeError: toggle is null

I have tried using it with settings, without settings. Something isn't
working about it though. Is it possible there is an error in the script?
To test it just go to the page and add 1 black chair to your cart. You'll
see the error.

Thanks Chris.


From: Chris Ferdinandi [mailto:notifications@github.com]
Sent: Thursday, February 27, 2014 5:33 PM
To: cferdinandi/smooth-scroll
Cc: dgoodale
Subject: Re: [smooth-scroll] Documentation Request (#43)

@dgoodale https://github.com/dgoodale - Thanks for the suggestion on
updating the docs. I just added a few examples, and will be doing so for my
other scripts as well. Cheers!

Reply to this email directly or view
<#43 (comment)
4> it on GitHub.
<https://github.com/notifications/beacon/6801220__eyJzY29wZSI6Ik5ld3NpZXM6Qm
VhY29uIiwiZXhwaXJlcyI6MTcwOTA3MzE2OSwiZGF0YSI6eyJpZCI6MjY1NjI5MDZ9fQ==--019d
f0fd54192d527233adcd102838e19fb5cf54.gif>

@cferdinandi
Copy link
Owner

I have a hunch what's going on here, and how to fix it. Not anything you're doing, but a bug in my code. Is FireFox giving you a line number that the error is occurring on?

@cferdinandi cferdinandi reopened this Feb 27, 2014
@dgoodale
Copy link
Author

Hi Chris,

No, but I checked in explorer using the developer tools and got this:

SCRIPT5007: Unable to get property 'getAttribute' of undefined or null
reference

File: smooth-scroll.js, Line: 121, Column: 3

Thanks Chris,

David Goodale


From: Chris Ferdinandi [mailto:notifications@github.com]
Sent: Thursday, February 27, 2014 6:47 PM
To: cferdinandi/smooth-scroll
Cc: dgoodale
Subject: Re: [smooth-scroll] Documentation Request (#43)

I have a hunch what's going on here, and how to fix it. Not anything you're
doing, but a bug in my code. Is FireFox giving you a line number that the
error is occurring on?

Reply to this email directly or view
<#43 (comment)
4> it on GitHub.
<https://github.com/notifications/beacon/6801220__eyJzY29wZSI6Ik5ld3NpZXM6Qm
VhY29uIiwiZXhwaXJlcyI6MTcwOTA3NzYxMywiZGF0YSI6eyJpZCI6MjY1NjI5MDZ9fQ==--b70f
8f0dfa37e393a37ec93886742446097beb14.gif>

@cferdinandi
Copy link
Owner

Hi David - I just pushed version 4.2, which includes a fix for this bug. Thanks again for letting me know about it, and helping me work through it. Let me know if you have any other questions or issues.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

2 participants