In Chrome, page won't scroll up (jQuery)?
Bottom of the page, clicking 'Send us your resume' should scroll to browser to the top of the page. Works in IE, FireFox, but in Chrome it refuses to scroll up.
Code:
/*
* Scroll to "Show Form", and Focus on first field in form
*/
$('#goto-show-form').click(function() {
$('html, body').animate({scrollTop: $("#show-form").offset().top}, '1000', 'swing', function() {
$('#first-field').focus();
});
return false;
});
Any ideas?
Thanks
EDIT: I hid the URL I had posted on here because I didn't want it indexed by Google. It'开发者_运维知识库s a website I made for client, and when they search their URL, I prefer it doesn't show any of the development talk that went into making their website.
But to see the initial error, check out: http://jsfiddle.net/rgPpE/12/ As you can see in Chrome, when you click the link at the bottom, it won't scroll. However, if you add something between the <a></a>
tags, like
, it will now scroll to there.
I can't test this right now, so I'll delete if this isn't the correct answer, but try scrolling to a non-empty element, like #send-resume
.
$('#goto-show-form').click(function() {
// --non empty target for the scroll---v
$('html, body').animate({scrollTop: $("#send-resume").offset().top}, '1000', 'swing', function() {
$('#first-field').focus();
});
return false;
});
Perhaps there's a bug in version 12.
EDIT: Verified. Targeting a non-empty element fixes the issue.
In your scrolling animation function, I see you're providing the duration as a string. Try providing it as an integer:
$('#goto-show-form').click(function() {
$('html, body').animate({scrollTop: $("#show-form").offset().top}, 1000, 'swing', function() {
$('#first-field').focus();
});
return false;
});
精彩评论