Disable Bounce in a webview


All in the title… I've made a search, and i found this code:
webview.disableBounce = true;

But, no error, and no change…

I've read all docs; but I think this isn't implemented yet…

Can you add this request or tell me how to use it?

Thanks, sorry for my bad english…


— asked 6 years ago by Ivan Mathy
  • the disableBounce is only available for ScrollView's, not WebView's.

    — commented 5 years ago by Alberto Marcone
  • For those has the same need,
    webview.disableBounce setting is available in 2.1
    but no idea why the latest API doc does not include such property.

    — commented 3 years ago by Bowie Poon
  • @Bowie Poon, you have no idea how much I want to thank you for pointing that!! this had to be in the docs already!! we were waiting for this property-fix for months now!!! :-)

    — commented 3 years ago by Alexandros Binopoulos

7 Answers

  • Hello,

    I was trying to disable the bounce for the webview so it would not "pull down" and show the shadow, this effect was needed for the UI of my app. As noted here and other posts this is not a option within TI. After some research I found a way to prevent the bounce. You will need to edit the TiUIWebView.m file in the classes folder of the TI SDK folder to incorporate this change.

    What I did was start with SDK 1.6.1 and duplicated the folder as 1.6.1_Web, then I opened TiUIWebView.m. Go to line 106 and add the following block of code after it.

    #define PAGE_VERTICAL_BOUNCE false
            if (!PAGE_VERTICAL_BOUNCE) {
                    for (id subview in webview.subviews)
                        if ([[subview class] isSubclassOfClass: [UIScrollView class]])
                            ((UIScrollView *)subview).bounces = NO;

    Save the file and then select the Titanium SDK 1.6.1_Web in TI Developer or TIStudio which ever you are using.

    Maybe with a little more work this could be an option through the TI SDK.

    — answered 5 years ago by Brian Rowe
    • Tried this with current SDK 1.7.5 and works fine. One just needs to insert the above before [self addSubview:webview];, as line 106 shifted somewhat with newer SDK… clean your project, recompile and your done!
      Would be great if the disableBounce setting could be implemented in a future release though, as this workaround is somewhat cumbersome.jh

      — commented 4 years ago by Stephan Betke
    • I can also confirm this works perfectly well.. good job!

      — commented 4 years ago by P Sweeney
    • This works in - Thanks for the fix!

      — commented 4 years ago by Matthew Hewes
    • Hi. I successfully implemented this into the class file, however, it has disabled bouncing in all webViews. Is there a way to alter/tweak this code so that when I define "disableBounce: true" it executes the above code from Brian, and if I don't have the line "disableBounce:" or "disableBounce: false" it does not execute the above code and the webView is then bounce-able? Thanks so much for your help guys!!

      — commented 4 years ago by Kyle Affolder
    • Worked for me. Thanks very much @ Ufumbuzi Development

      — commented 4 years ago by Jonathan Andrew
    • this worked for me too! great! just one thing that I noticed is that the touchmove events inside the page seem disabled. Is it just me? (like scrollbars and such)

      — commented 3 years ago by Alberto Marcone
  • If you have a fixed size page and don't need any scrolling at all you can set this in the html and it prevents the webview from bouncing (and scrolling at all for that matter):

    document.ontouchmove = function(event){

    I have tested this with an embedded Google Map and toolbar div that is absolutely positioned in the html (at the bottom of the page so that it replicates a tab bar). This code still allows the user to scroll the map but if you touch the nav element and try to drag it up, it no longer bounces. So it is a perfect solution for my use. However it would be better if there was a way to allow a webview to scroll and yet not bounce at the top and bottom of the page.

    — answered 5 years ago by brian kurzius
    • This is definitely worth checking out: http://code.google.com/mobile/articles/webapp_fixed_ui.html

      — commented 5 years ago by brian kurzius
    • does the trick for me, thanks!

      — commented 5 years ago by Kai De Sutter
    • If the view is within a scrollableView - this function breaks the functionality…

      — commented 4 years ago by Matthew Hewes
  • WebView now supports (undocumented for some reason) disableBounce property:


  • Here is how to add the disableBounce property to the web view - tested with Ti.UI.createWebView only, not with accessors. Version 2.0.1 of API. Need to open TiUIWebView.m in ~/Library/Application Support/Titanium/mobilesdk/osx/2.0.1.GA2/iphone/Classes. Go to line 116 and add the following code:

            if([TiUtils boolValue:[self.proxy valueForKey:@"disableBounce"]])
                [[self scrollview] setBounces:NO];

    Then in your project you can have the following:

        var webview = Ti.UI.createWebView({

    Clean your project then build again. The WebView will no longer bounce. Enjoy!

  • Tested OK with 2.1.3GA (without any modification) / Ipad IOS 6.0

    Mikhail Yurasov has the solution "disableBounce", here is an example of a fullscreen window with a webview in it, webview keeps touchevents from the url you have loader, but disable bounce effects on the view …

    var myTiWindow= Ti.UI.createWindow({
    var myWebViewWithoutBounceEffect = Ti.UI.createWebView({
        touchEnabled:true, //optional
    myTiWindow.add(myWebViewWithoutBounceEffect );

    Ivan Mathy, please mark post as answered.

  • try horizontalBounce but i am not 100% sure if it works in the webview


  • I have used touchEnabled:false but this also disabled the touch event on the view. (but no scroll….)