点击区域下弹出列表

嗨，我有一些简单的弹出列表，显示一次我点击下拉菜单选项。不幸的是，弹出窗口在CSS绝对下，没有弹出窗口在页面下。
此外，它显示在不同浏览器的不同位置。点击区域下弹出列表

$self.next().bind('click', viewList); 

    if (!settings.appendTo) { 
     $self.after(createDropdown($self, selectboxCounter)); 
    } else { 
     var offset = $self.parent().offset(); 

     $(settings.appendTo).append(createDropdown($self, selectboxCounter).css({ 
     'top': offset.top, 
     'left': offset.left, 
     'width': 100//'width': $self.parent().width() * 0.8 
     })); 
    } 
    } 

    $self.trigger('change'); 
    selectboxCounter++; 
}); 

// Hide dropdown when click is outside of the input or dropdown 
$(document).bind('click', hideDropdown); 

$('.sb-custom').find('.sb-select').live('keydown', selectKeypress); 
$('.sb-custom').bind('blur', clearKeyStrokes); 
$(document).delegate('.sb-dropdown', 'focus', viewList); 

return this; 
};

我想将弹出窗口放在父选择位置或菜单位置。并且还适应不同的浏览器。

来源

2012-07-06 arkmon

你可以jsfiddle你的示例代码？没有它成像的问题是相当困难 – Hardik 2012-07-08 18:22:27

把你的HTML和JS上jsfiddle.net或jsbin.com – MaX 2012-07-12 14:46:44

最近用一个我正在帮助开发的小部件来解决这个问题。我们想出的解决方案是将弹出列表绑定到文档主体。以身体为父母，我们不必担心隐藏弹出窗口的其他元素。然后，我们就根据它从哪里跳下来确定它的位置。

var offset = $("#popupFromHere").offset(); 
$("#popup") 
    .appendTo("body") 
    .css({ 
     left: offset.left 
     top: offset.top + $this.outerHeight(true) 
    });

来源

2012-07-19 18:00:25 jholloman

点击区域下弹出列表

回答

相关问题