HTML time input type - how to let select time menu view when click anywhere not only clock icon click

Viewed 2192

I working on time input type in html , my problem is when i click on small clock icon on the right side of input ,selectable time menu viewed but i need to show it when i click anywhere on input . enter image description here

I found this question but this not solve my problem because it's about timepacker not html only .

show timepicker on click whole input type time HTML5 field not only on little clock icon

HTML :

  <label for="first" class="">{{__('From Hour')}}</label>
   <input type="time" class="form-control input-md"name="" id="from_hour" value="">
2 Answers

Credit to @StepPen-codes at How To Open HTML Date Picker Dialog On Click Anywhere Inside Input?

You can use CSS to do the trick. It works but in my case, the calendar icon disappears. I try to bring it back but the position isn't nice.

input#session-date::-webkit-calendar-picker-indicator{
  display:block;
  top:0;
  left:0;
  background: #0000;
  position:absolute;
  transform: scale(12)
}
Related