Kendo multiselect jQuery design issue

I have placed the kendo multiselect and trigeering the open event on page load as below.

var dropdown = $('#cont1').data("kendoMultiSelect"); dropdown.open();

when i resize the page or doing anything on the page only it shows popup of the kendo multiselect. why its behave like that

Kindly provide me the solution to make the mulitiselect as responsive.

  $("#cont1").kendoMultiSelect({
        //open: function (e) {
    
        close: function (e) {
            e.preventDefault(false);
        },

        itemTemplate: "<input type='checkbox'/>&nbsp; #:data.NAME#",
        headerTemplate: "<div class='ddAll' id='ddAll1'><input type='checkbox' id='HeaderCom'><label id='lblHeaderCom'> All</label></div>",
        dataTextField: "NAME",
        dataValueField: "ID",
        dataSource: {
            type: "JSON",
            serverFiltering: true,
            data: eval(daly)
        },

        filter: "contains",
        autoClose: false,       
        downArrow: true,
        tagMode: "single",
        tagTemplate: 'Com &nbsp;&nbsp; <span class="ddCircle">&nbsp; #:values.length# &nbsp;</span>',
        dataBound: function () {
            var items = this.ul.find("li");
            setTimeout(function () {
                checkInputs(items);
            });
        },
        change: function () {
            var items = this.ul.find("li");
            checkInputs(items);

            onchangeCompany();
        }
        
    });

 setTimeout(function () {
        $(window).trigger('resize');
    }, 200)