在图像位置显示日期选择器

Question

如何显示将在图像位置显示的日期选择器？我正在使用图像来触发datepicker。

Answer 1

有趣。 API提到datepicker仅适用于input，div和span，但我看过一些带有textarea的例子。

我使用了经典输入元素，并将其格式化为接受带有此FIDDLE的背景图片。

我认为这会给你一个开始。

CSS

#dp {
    height: 50px;
    width: 600px;
    background: url(http://blog.ebyline.com/wp-content/uploads/2013/06/copywriting-long-vs-short1.jpg);
    background-size: cover;
    border: 1px solid black;
    position: relative;   
}

JS

$("#dp").datepicker({
    buttonImageOnly: 'false',
        showOn: 'both',
    beforeShow: function (textbox, instance) {
            instance.dpDiv.css({
                    marginTop: 2,
                    marginLeft: 1
                                });
                                              }

     });