jScrollHorizo​​ntalPane滚动条最初未在webkit浏览器中显示

时间:2012-02-25 21:57:55

标签: jquery jscrollpane

使用版本:2.0.0beta11的jScrollPane jQuery插件(最新版本)...所有必需的文件都是最新的,直接从他们的网站提取:jScrollHorizontalPane

Firefox + IE没有问题。 Chrome,Opera + Safari最初不会显示滚动条,直到执行调整大小。最大化,恢复或手动调整窗口将提示浏览器显示滚动条...这是我的代码(窗格正在保存图像):

这是我的代码:

$(function () {
            var win = $(window);
            // Full body scroll
            var isResizing = false;
            win.bind('resize',
                function () {
                    if (!isResizing) {
                        isResizing = true;
                        var container = $('#gallery_scroll');
                        // Temporarily make the container tiny so it doesn't influence the
                        // calculation of the size of the document
                        container.css({ 'width': 1, 'height': 1 });
                        // Now make it the size of the window...
                        container.css({ 'width': win.width(), 'height': 530 });
                        isResizing = false;
                        container.jScrollPane({ showArrows: true, autoReinitialise: true, enableKeyboardNavigation: true, animateScroll: true, horizontalGutter: 10 });
                    }
                }
            ).trigger('resize');

            // Workaround for known Opera issue which breaks demo (see
            // http://jscrollpane.kelvinluck.com/known_issues.html#opera-scrollbar )
            //$('body').css('overflow', 'hidden');

            // IE calculates the width incorrectly first time round (it
            // doesn't count the space used by the native scrollbar) so
            // we re-trigger if necessary.
            if ($('#gallery_scroll').width() != win.width()) {
                win.trigger('resize');
            }


            $('#gallery_scroll').jScrollPane({ showArrows: true, autoReinitialise: true, enableKeyboardNavigation: true, animateScroll: true, horizontalGutter: 10 });

        });



<div id='gallery'>
            <div class='holder'>
                <div id='gallery_scroll' class='scroll-pane horizontal-only'>
                    <ul class='blocks'>
                    @if(Model != null){
                        foreach (var item in Model)
                        {
                            <li class='scroll-interval'><img src="@Url.Content(item.Path)" style="height:500px; width:@item.Width;" alt="" /></li>                                                                    
                        }
                    }
                    </ul>
                </div>
            </div>
        </div>  

我在这里遗漏了什么吗?

更新:也许我应该更直接...如果没有已知问题 - 暂时 - 是否有办法在初始加载后刷新jScrollPane()以暂时缓解此问题?

0 个答案:

没有答案