Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 203
  • Last Modified:

jQuery function callback

Hello Experts,

Below is my function. I am trying to add a callback but no luck.
The call back i am trying to add is at the end of the code. Where and how can I add the callback?

function scrollToID(id, speed) {
	var offSet = $(".header").height();
	var targetOffset = $(id).offset().top - offSet;
	$('html,body').stop().animate({scrollTop:targetOffset}, speed, "easeInOutExpo");
};

$(document).ready(function() {

    $('.scroll-link').on('click', function(event){				
	event.preventDefault();
	var sectionID = $(this).attr("data-id");
	$('#' + sectionID).show();			
	scrollToID('#' + sectionID, 1500);
	});
});

// this is the callback. and it should be right after scrollToID is completed.
$(".page-section").not('#' + sectionID).hide();

Open in new window

0
Refael
Asked:
Refael
  • 5
  • 4
1 Solution
 
GaryCommented:
$('html,body').stop().animate({scrollTop:targetOffset}, speed, "easeInOutExpo",function(){
	$(".page-section").not('#' + sectionID).hide();
});

Open in new window

0
 
Ahmed MerghaniCommented:
Try this code:
function scrollToID(id, speed) {
	var offSet = $(".header").height();
	var targetOffset = $(id).offset().top - offSet;
	$('html,body').stop().animate({scrollTop:targetOffset}, speed, "easeInOutExpo");
};

$(document).ready(function() {

    $('.scroll-link').on('click', function(event){				
	event.preventDefault();
	var sectionID = $(this).attr("data-id");
	$('#' + sectionID).show();			
	scrollToID('#' + sectionID, 1500);
        // this is the callback. and it should be right after scrollToID is completed.
        $(".page-section").not('#' + sectionID).hide();
	});
});


                                  

Open in new window

0
 
RefaelAuthor Commented:
Hi Gary

I tried it before and i get an error "ReferenceError: offset is not defined - var targetOffset = $(id).offset().top - offset;"
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
RefaelAuthor Commented:
Sorry Gary the error is "ReferenceError: sectionID is not defined - $(".page-section").not('#' + sectionID).hide();" and not the one i posted before.
0
 
GaryCommented:
$('html,body').stop().animate({scrollTop:targetOffset}, speed, "easeInOutExpo",function(){
	$(".page-section").not('#' + id).hide();
});

Open in new window

0
 
RefaelAuthor Commented:
Gary Thank you!

Still gives a strange error but when I removed the "#" it looks like it is working so...

"$(".page-section").not(id).hide();" can it be?

Gary in the code:

"var targetOffset = $(id).offset().top - offSet;"

How I can change it to a number, e.g. 50. I have tried:

"var targetOffset = $(id).offset().top = 50;"

But it did not work.....
0
 
GaryCommented:
Yeah, you are passing the # in the function param so not needed.
0
 
GaryCommented:
Not sure what you mean?
"var targetOffset = $(id).offset().top = 50;"

Take 50 away or make it 50?
0
 
RefaelAuthor Commented:
:-) make it 50
0
 
GaryCommented:
Then just

var targetOffset = 50;
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

  • 5
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now