smooth-scrolling

I want to smoothly scroll to an element without using jQuery – just pure javascript. I would like a generic function to be able to both scroll down and scroll up smoothly to a specific position in the document. I know I can use the following in jQuery: $('html, body').animate({ scrollTop: $('#myelementid').offset().top }, 500); How would I do it with just javascript? This is what I am trying to do: function scrollToHalf(){ //what do I do? } function scrollToSection(){ //What should I do here? } <input type="button" onClick="scrollToHalf()" value="Scroll To 50% of Page"> <br> <input type=

I changed the background of my discussion forum using the CSS below http://forum.antinovaordemmundial.com html { background: url(http://antinovaordemmundial.com/mystuff/logo_blog.jpg) no-repeat center center fixed; background-image: url(http://antinovaordemmundial.com/mystuff/logo_blog.jpg); background-repeat-x: no-repeat; background-repeat-y: no-repeat; background-attachment: fixed; background-position-x: 50%; background-position-y: 50%; background-origin: initial; background-clip: initial; background-color: initial; -webkit-background-size: cover; -moz-background-size: cover; -o-background

I have a page where I'm applying a parallax effect. This is accomplished using translate3d. Now, while this works well, I'm wondering how I can override the default "steps" when scrolling with the mouse wheel? If I scroll with the scrollbars, everything is fine. But with the mouse wheel, it's all jumpy. I'm doing this in a pretty straight forward way: var prefix = Modernizr.prefixed('transform'); $window.on('scroll', function(){ var scroll_top = $window.scrollTop(); if(scroll_top < forside_infographics_offset){ $_('#slider').css(prefix , "translate3d(0,"+(scroll_top/3)+"px,0)"); } }); Now, I

I'm building a one-page site with a fixed-positioned navigation bar which scrolls smoothly to the different section elements through anchor links. The default behaviour for scrolling to an element is to align it to the top of the browser window. Instead, I want to align the element to the middle of the screen. I use this markup for navigation: <nav class="main-nav"> <a href="#top">Top</a> <a href="#section-1">Section 1</a> <a href="#section-2">Section 2</a> <a href="#section-3">Section 3</a> <a href="#section-4">Section 4</a> <a href="#section-5">Section 5</a> </nav> I use kswedberg's jQuery

I have a situation in that I am using a horizontal scroll view with images and using buttons to smooth scroll to the different image locations. Now it works okay I was just wondering if anyone knew of anyway to slow down the smooth scroll method, i.e. having a longer annimation time? As currently the snapping happens pretty quickly. Perhaps through an override of the smoothscroll, I have tried to search for this/examples but to no luck. So any ideas? Thanks, Si How About: ObjectAnimator animator=ObjectAnimator.ofInt(yourHorizontalScrollView, "scrollX",targetXScroll ); animator.setDuration(800)

I'm trying to smoothly scroll to last element of a list after adding an element to the arrayadapter associated with the listview. The problem is that it just scrolls to a random position arrayadapter.add(item); //DOES NOT WORK CORRECTLY: listview.smoothScrollToPosition(arrayadapter.getCount()-1); //WORKS JUST FINE: listview.setSelection(arrayadapter.getCount()-1); You probably want to tell the ListView to post the scroll when the UI thread can handle it (which is why yours it not scrolling properly). SmoothScroll needs to do a lot of work, as opposed to just go to a position ignoring velocity