Develop Reference

Jquery scroll to a div after click a button then hide the button after scroll

I wanted to hide a button when window scroll to a div and show again when scroll out from this div. I also wanted after click on this button this window will scroll to the div and hide the div. But problem is after click on the button and scroll to the div the button not hiddeing. here is my code
$(document).ready(function() {
$(window).scroll(function() {
var scroll_top = $("#right-side-bar").offset().top;
if ($(window).scrollTop() < scroll_top ) {
$(".timestsw-apply-stic").addClass('apply-sticky-btn');
} else {
$(".timestsw-apply-stic").removeClass('apply-sticky-btn');
}
});
$('a#stick').on('click',function (e) {
e.preventDefault();
$('html, body').animate({
scrollTop: $("#right-side-bar").offset().top
}, 500,function () {
$(".timestsw-apply-stic").removeClass('apply-sticky-btn');
});
})
});
please help me how can i solve this. thanks

scroll-to-top button on a mobile website

I'm trying to make the Scroll To Top button appear once the user started scrolling down, instead of it always being present, even when being at the top. Quick note, I barely have experience with JS, so I have no idea what I'm doing.
Anyway here is the page I'm having an error on: http://www.m.evans-carpentry.com/gallery/projects/
<script>
$(function() {
var $elem = $('#content');
$('#nav_up').fadeIn('slow');
$('#nav_down').fadeIn('slow');
$(window).bind('scrollstart', function(){
$('#nav_up,#nav_down').stop().animate({'opacity':'0.2'});
});
$(window).bind('scrollstop', function(){
$('#nav_up,#nav_down').stop().animate({'opacity':'1'});
});
$('#nav_down').click(
function (e) {
$('html, body').animate({scrollTop: $elem.height()}, 800);
}
);
$('#nav_up').click(
function (e) {
$('html, body').animate({scrollTop: '0px'}, 800);
}
);
});
</script>
Thanks!

you call jquery earlier announcements of jquery on line 30
<script>$('#nav Li: has (ul)').doubleTapToGo ();</script>
insert this line after the call jquery

Your code is too complex, try this:
$(document).ready(function(){
//Check to see if the window is top if not then display button
$(window).scroll(function(){
if ($(this).scrollTop() > 100) {
$('.scrollToTop').fadeIn();
} else {
$('.scrollToTop').fadeOut();
}
});
//Click event to scroll to top
$('.scrollToTop').click(function(){
$('html, body').animate({scrollTop : 0},800);
return false;
});
});
".scrollToTop" is the thing to be clicked that scrolls back to the top of the page.

jQuery scroll function does not work

I have this function:
$(document).ready(function() {
if ($(".splash").is(":visible")) {
$(".site").css({"opacity":"0"});
}
});
$(window).scroll(function(){
$(window).off("scroll");
$(".splash").slideUp("800", function() {
$("html, body").animate({"scrollTop":"0px"},100);
$(".site").delay(100).animate({"opacity":"1.0"},800);
});
})
I use this to pass from splash page to home in animation way. But when I'm in home page the scroll is still off and I need it to make a change in hte header. I use this code:
$(document).ready(function( $ ) {
$(window).scroll(function() {
var sT = $(this).scrollTop();
if (sT >= 200) {
$('header').addClass('scroll-header')
} else {
$('header').removeClass('scroll-header')
}
});
});
This two parts fight together!! How can I put on scroll after splash page to go out? Thanks!

In the end i have try to not use scroll off, and change with a simple
.show_splash{position: fixed;}
In this way finely work!!!

jQuery Collapse when scroll

I need help here... I have a menu that is collapsible, when the page starts I want to stay open but when scroll down I want to be collapsed... Is there any option for that?
$('#slide-button').click(function(){
$('#menu-list').animate({width: 'toggle'},500);
$(this).toggleClass('inactive');
});
Here is my site http://astritbublaku.com/demos/dukagjini/

try this:
$(window).scroll(function(){
if ( $(window).scrollTop() > 0 ) {
$('#menu-list').animate({"width": minWidth },500);
$(this).addClass('inactive');
}
else
{
$('#menu-list').animate({"width": maxWidth },500);
$(this).removeleClass('inactive');
}
});

You can use following;
$(document).ready(function() {
// Start as opened
$(".book-toggle").trigger("click");
// When scrolled, if collapsible is opened, close it
$(window).scroll(function() {
// Check if it is already closed. It has class 'inactive' when it is open
if ($(".book-box").hasClass("inactive") == false) {
$(".book-toggle").trigger("click");
}
});
});

button to scroll all the way to the top with click of button

i have this javascript so that when a user is scrolling on the page there will be a small icon to the side that will scroll all the way back up the page rather than manually scrolling. The button shows fine but when i click on it it is not going all the way to the top.
html
Scroll
Script
$(document).ready(function () {
$('#main').scroll(function () {
if ($(this).scrollTop() > 100) {
$('.scrollup').fadeIn();
} else {
$('.scrollup').fadeOut();
}
});
$('.scrollup').click(function () {
$("html, body, main_container, main").animate({ scrollTop: 0 }, 600);
return false;
});
});

problem is in the selectors, you are missing either # id selector or . class selector, to me it seems id:
change this:
$("html, body, main_container, main")
to this and see if it helps:
$("html, body, #main_container, #main")
//-------------^----------------^--------these selector notations