IScroll5 and Jquery Mobile listview flickering while scrolling

Question

I have been trying to merge jquery mobile and iscroll5 for my project where I need pull to refresh function, smooth facebook like scrolling and loading content on scroll end. I have found one script which is working perfectly without jquery mobile, but when I use jquery mobile and try to scroll it detects my scrolling like hovering and when my finger is on the screen it is not smooth scrolling, and as I release it start to be smooth again.

I have been reading all articles these few last days and I couldnt fix it. I am using whis script http://pnc.co.il/dev/iscroll-5-pull-to-refresh-and-infinite-demo.html

Jquery Mobile version is 1.4.5. I am using it for cordoba latest versin project on android device.

The code is all from link I have provided, only change is that I have included jquery mobile javascript, css and themes folder.

I have changed this code

else if (refresh && next_page) {
                // Loading the next-page content and refreshing
                    $(function() {
                    inc += 10;
                    $.ajax({
                        dataType: "json",
                        url: "http://domain/json.php?l="+inc,  
                        type: "get",
                        success: function(data) {
                        console.log(data);
                            var temp    = '';
                            var i       = 0;
                            $.each(data, function(key, val) {
                                temp += '<li style="display:none" id="'+val.id+'"><a href="' + val.link + '" data-transition="slide" ><div class="imgLiquidFill imgLiquid" style="width:80px; height:60px;">' + val.slika + '</div><h2>' + val.naslov +'</h2><p><b>' + val.izvor + '</b>: ' + val.datum + '</p><p>' + val.tekst + '</p></a><div class="clear"></div></li>';

                                ++i;
                            });
                            $.mobile.loading( 'hide');
                            $('#wrapper > #scroller > ul').append(temp).listview('refresh');  
                            $(".imgLiquidFill").imgLiquid({fill:true}); 
                            $('li:hidden').show();              
                        }
                    }); 
                }); 

I am getting updated code on scroll, but my problem is that I cant scroll smooth

I think it would be best if I could lock clicking while scrolling, so My initial tap on screen would not be treated as click if it is start of scrolling.

css

    * {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    html {
        -ms-touch-action: none;
    }

    body,ul,li {
        padding: 0;
        margin: 0;
        border: 0;
    }

    body {
        font-size: 12px;
        font-family: ubuntu, helvetica, arial;
        overflow: hidden; /* this is important to prevent the whole page to bounce */
    }

    #wrapper {
        position: absolute;
        z-index: 100;
        top: 45px;
        bottom: 48px;
        left:9999px; /* Not a must - can be 0 - but it makes the appearance of the content a bit nicer */
        width: 100%;
        background: #ccc;
        overflow: hidden;
    }

    #scroller {
        position: absolute;
        z-index: 100;
        -webkit-tap-highlight-color: rgba(0,0,0,0);
        width: 100%;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-text-size-adjust: none;
        -moz-text-size-adjust: none;
        -ms-text-size-adjust: none;
        -o-text-size-adjust: none;
        text-size-adjust: none;
    }

    #scroller ul {
        list-style: none;
        padding: 0;
        margin: 0;
        width: 100%;
        text-align: left;
        -webkit-transform: translate3d(0px, 0px, 0px);
    }

    #scroller li {
        padding: 0 10px;
        height: 80px;
        line-height: 80px;
        border-bottom: 1px solid #ccc;
        border-top: 1px solid #fff;
        background-color: #fafafa;
        font-size: 14px;
    }

scroller settings

myScroll = new IScroll('#wrapper', {
                probeType:1, 
                tap:true, 
                click:false, 
                preventDefaultException:{tagName:/.*/}, 
                mouseWheel:true, 
                scrollbars:true, 
                fadeScrollbars:true, 
                interactiveScrollbars:false, 
                keyBindings:false,
                deceleration:0.0002,
                startY:(parseInt(offset)*(-1))
            });