Sometime the autocomplete menu will not be entirely visible because of
the input is at the bottom of the screen
To fix this problem i have created a small hack that will position the
selectbox on top of the input.


To see what I mean  look at the image:
http://tinypic.com/r/t6zcrc/5

code:
autocomple.js line 701:
replace function show by
[code]
show: function() {
                if(options.scroll) {
                list.scrollTop(0);
                list.css({
                                        maxHeight: options.scrollHeight,
                                        overflow: 'auto'
                                });

                if($.browser.msie && typeof
document.body.style.maxHeight === "undefined") {
                                        var listHeight = 0;
                                        listItems.each(function() {
                                                listHeight += this.offsetHeight;
                                        });
                                        var scrollbarsVisible = listHeight > 
options.scrollHeight;
                    list.css('height', scrollbarsVisible ?
options.scrollHeight : listHeight );
                                        if (!scrollbarsVisible) {
                                                // IE doesn't recalculate width 
when scrollbar disappears
                                                listItems.width( list.width() - 
parseInt(listItems.css("padding-
left")) - parseInt(listItems.css("padding-right")) );
                                        }
                }
            }

            var offset = $(input).offset();
                        var topPos = offset.top + input.offsetHeight;
            var leftPos = offset.left;

            var elmHeight = element.height();
            var windowHeight = $(window).height();

            // Check that position of Select does not go off screen-
If so put select on top .
            if ( (topPos + elmHeight) > windowHeight) {
                topPos = offset.top - elmHeight;
            }

            element.css({
                                width: typeof options.width == "string" || 
options.width > 0 ?
options.width : $(input).width(),
                                top: topPos,
                                left: leftPos
                        }).show();
                },
[/code]

Hope it helps someone

Cheers

Reply via email to