javascript - html5 input element "date" - how to show calendar element -

i have calendar picker working using jqueryui wanted try convert native date picker.

i'd able have following:

1. start "< input id="nativedate" type="date"/>" element being hidden view.
2. when main page element clicked, have < input > element show, with calendar opened
3. when user selecs date on calendar, element hidden.

right when step 2, < input > item showing calendar hidden, user must click have element appear , click again have calendar show , third click select date.

edit: i've tried following:

$('#nativedate').click(function(){     console.log('click logged'); }) 

and in method:

$(#nativedate).trigger('click');

which works in terms of event handler i've set up, does not open calendar

some questions:

---

i) browser's native datetime element opening or calender opening on input decleration ?
ii) if item not showing after time try javascript force keep open nearby specific input tag?

these may help

---

disable native datepicker in google chrome
remove background arrow date input in google chrome v20

---

or try google search or can edit browsers native datetime picker using css.