Develop Reference

How can ı do scrolltop with jquery?

<div class="logo-contentBlock">
BLOG
</div>
<div class="logo-contentBlock">
BLOG
</div>
.
.
.
<div id="#logo-first-content">.....</div>
<div id="#logo-second-content">....</div>
$(".content-page-scroll-1").click(function() {
$('html, body').animate({
scrollTop: $('#content-first-content').offset().top - 60
},5000);
});
$(".content-page-scroll-2").click(function() {
$('html, body').animate({
scrollTop: $('#content-second-content').offset().top - 60
}, 5000);
});
$(".content-page-scroll-3").click(function() {
$('html, body').animate({
scrollTop: $('#logo-thirt-content').offset().top - 60
}, 5000);
});
Hello, ı just want scrolltop 60 but ı have 9 content like that that means a lot of jquery. How can i do shorten my code with jquery?

The thing to notice here is that the only thing changing between the callbacks is the CSS-selector. To stay DRY here, I would define a function that takes a CSS-selector and returns the click-handler.
Working off your example, for example like so:
const cbFactory = selector => () => {
$('html, body').animate({
scrollTop: $(selector).offset().top - 60
},5000);
};
$(".content-page-scroll-1").click(cbFactory('#content-first-content'));
$(".content-page-scroll-2").click(cbFactory('#content-second-content'));
$(".content-page-scroll-3").click(cbFactory('#logo-thirt-content'));

how to Scroll to the end of a div in a single scroll

I have a div with 100% height of the screen and i want it to scroll like this website. One little scroll should take me to the end of a division.
$('html, body').animate({
scrollTop: $("#target-element").offset().top
}, 1000);
I was using this code but its not working. Help

This code should works:
$( "body" ).scroll(function() {
$('html, body').animate({
scrollTop: $("#target-element").offset().top
}, 1000);
});

jQuery run onclick function only once

How can I execute this function only one time?
I tried .one but it doesn't work
$('a.inspire-tag').on('click',function () {
$('html, body').animate({
scrollTop: $(".button-inspire").offset().top
}, 400);
});

If you want to do is just click once to enable
Try this:
$('a.inspire-tag').on('click',function () {
$('html, body').animate({
scrollTop: $(".button-inspire").offset().top
}, 400);
$('a.inspire-tag').off('click');
});

$('a.inspire-tag').on('click',doThis);
function doThis () {
$('html, body').animate({
scrollTop: $(".button-inspire").offset().top
}, 400);
//you can off all on callback function
$('a.inspire-tag').off('click',doThis);
}

Use .off(), with name spaced event names
$('a.inspire-tag').on('click.myevent', function () {
if (...)
// remove current event handler
$(this).off('click.myevent')
});

var oneTime = true;
$('a.inspire-tag').on('click',function () {
if(oneTime) {
$('html, body').animate({
scrollTop: $(".button-inspire").offset().top
}, 400);
oneTime = false;
}
});

var inspiretag = $('a.inspire-tag');
inspiretag.on('click',function () {
$('html, body').animate({
scrollTop: $(".button-inspire").offset().top
}, 400);
inspiretag.off('click');
});
http://api.jquery.com/off/

Selection and focus on element of webpage not working (offset)

My question is a little tricky to explain, but I will try anyway. I have two horizontal tabs which, when you click on them, open a text box content. I'm trying to "focus" on them when they get clicked on. I've found a lot of material online but nothing works except for this code I'm showing below:
$(".accordionButton").click(function() {
$('html, body').animate({
scrollTop: $(this).offset().top
}, 500);
});
$(".accordionButtonone").click(function() {
$('html, body').animate({
scrollTop: $(this).offset().top
}, 500);
If I only click on the first accordionButton it works. If I click on the second accordionButton for first, it works. If I click on the first accordionButton after I've clicked on the second it works, but if I click on the second accordionButton after I click on the first it doesn't work: the focus remains at the bottom of the page. I don't know what could be the problem, I'm making some attempt with the animate function (jQuery tutorial) and the offset function (jQuery tutorial) but I would be grateful even only to know what is going wrong...
UPDATE: a partial solution is
$(".accordionButton").click(function() {
$('html, body').animate({
scrollTop: $(this).offset().top
}, 500);
});
$(".accordionButtonone").click(function() {
$('html, body').scrollTop(0);
});

$(".accordionButton").click(function() {
$('html, body').animate({
scrollTop: $(this).nextAll('div .accordionContent').offset().top
}, 500);
});
$(".accordionButtonone").click(function() {
$('html, body').animate({
scrollTop: $(this).nextAll('div .accordionContentone').offset().top
}, 500);
})
You have to put all that into a callback
$('.accordionContent').slideUp('normal', function(){
$(".accordionButtonone").click(function() {
$('html, body').animate({
scrollTop: $(this).nextAll('div .accordionContentone').offset().top
}, 500);
})
});

The solution is NOT elegant, but it works:
$(".accordionButton").click(function() {
$('html, body').animate({
scrollTop: $(this).offset().top
}, 10);
});
$(".accordionButtonone").click(function() {
$('html, body').scrollTop(458);
});

You are making it scroll down by using offset. remove the offset and it will stop scrolling down. also, instead of using individual selectors, why don't you write some code that utilizes jquery's 'this'
$(this)

Cant get JSFiddle to Work

I added the code below to the top of my JSFiddle and It stopped working, I would think its a simple fix but I can't figure it out:
$('html, body').animate({
scrollTop: target.offset().top
}, 200);
// assign the correct target
var target = $('#if_two');
// scroll!
$('html, body').animate({
scrollTop: target.offset().top
}, 200, function(){
target.css({'border-color': 'red'})
});
What am I doing wrong?

The problem was just the ordering of your code. When the code gets evaluated it actually works more like this
var target;
$('html, body').animate({
scrollTop: target.offset().top
}, 200);
// assign the correct target
target = $('#if_two');
// scroll!
$('html, body').animate({
scrollTop: target.offset().top
}, 200, function(){
target.css({'border-color': 'red'})
});
This process is called variable hoisting. So when
$('html, body').animate({
scrollTop: target.offset().top
}, 200);
executes, target is still undefined. If you order your code in the following way it works.
// assign the correct target
var target = $('#if_two');
$('html, body').animate({
scrollTop: target.offset().top
}, 200);
// scroll!
$('html, body').animate({
scrollTop: target.offset().top
}, 200, function(){
target.css({'border-color': 'red'})
});
Here the fiddle:
http://jsfiddle.net/TomLee/TwtD9/5/

You are using target before it's defined. See here for working example: http://jsfiddle.net/TwtD9/4/
// assign the correct target
var target = $('#if_two');
$('html, body').animate({
scrollTop: target.offset().top
}, 200);
// scroll!
$('html, body').animate({
scrollTop: target.offset().top
}, 200, function(){
target.css({'border-color': 'red'})
});

All the commenters and the answer are of course right, but do you know of the developer console (f12 in most browsers)? because if you open that console, you will see the error, as mentioned:
'Uncaught TypeError: Cannot call method 'offset' of undefined'