Question

我正在使用以下Bootstrap插件，并且基本上想要更改包含calander / time picker的popover的位置，以显示在加载项按钮的左侧，而不是在插件演示中的右侧。

http://tarruda.github.io/bootstrap-datetimepicker/

我仍然需要右侧的加载项按钮，但要求弹出窗口显示在输入字段下方的左侧。

Answer 1

我认为这是关于它的：

<div class="container-fluid">
    <div class="row-fluid">
        <div class="span12">
            <input id="simpleInput" type="text" class="span3 datepicker" />
            <div class="control-group">
                <label class="control-label" for="dateTest">New Date:</label>
                <div class="controls">
                    <div class="input-append date datepicker">
                        <input id="compInput" class="span6" type="text" /> <span class="add-on"><i class="icon-th"></i></span>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

使用

#target {
    margin: 2em;
}

Live DEMO

Answer 2

您可以通过添加

将Datetimepicker的位置更改为左侧

pickerPosition: "bottom-left"

尝试这样的事情：

$(function() {
    $('#your_date_time_picker').datetimepicker({
      language: 'en',
      pickerPosition: "bottom-left"
    });
  });

其他定位选项包括：

pickerPosition: "bottom-left"
pickerPosition: "top-left"
pickerPosition: "top-right"

Bootstrap Datetimepicker - 更改弹出位置

2 个答案: