In iOS, the following code has a noticeable flicker between the hide() and the scrollBy():

element.hide();
window.scrollBy(0, -elementHeight);

This is because toggling between display: none and display: block on iOS is a heavy task, as if the elements are being added to and removed from the DOM.

I need a way to perform window.scrollBy() as a callback, once the hide() has successfully pleted and the DOM has updated. Is there a way to do this in jQuery?

In iOS, the following code has a noticeable flicker between the hide() and the scrollBy():

element.hide();
window.scrollBy(0, -elementHeight);

This is because toggling between display: none and display: block on iOS is a heavy task, as if the elements are being added to and removed from the DOM.

I need a way to perform window.scrollBy() as a callback, once the hide() has successfully pleted and the DOM has updated. Is there a way to do this in jQuery?

• javascript
• jquery

• Just read the documenation. element.hide(callback); facepalm – user1031947 Commented Sep 20, 2014 at 21:53
• 1 stackoverflow./questions/7769475/… – nisargjhaveri Commented Sep 20, 2014 at 21:55

2 Answers 2

Either pass a duration and a callback, or just pass a callback option, like this:

element.hide(0, some_function);

// or 

element.hide({done: some_function});

By default, the second option takes 400 ms. To do it immediately, use one of these:

element.hide(0, some_function);

// or 

element.hide({duration: 0, done: some_function});

Here's a jsFiddle demo.

See the jQuery documentation for more details.

From the jQuery api:

.hide(options)

plete Type: Function() A function to call once the animation is plete.

Try this:

element.hide({plete: function(){ window.scrollBy(0, -elementHeight); });