На trackbar с двумя ползунками установить отсеки данных на каждый сверху
function custom_checkout_fields() {
$checkout = WC()->checkout(); ?>
<div class="date-time">
<p><?php _e( 'Дата и время' ); ?></p>
<?php
foreach ( $checkout->checkout_fields['custom'] as $key => $field ) : ?>
<?php woocommerce_form_field( $key, $field, $checkout->get_value( $key ) ); ?>
<?php endforeach; ?>
<div id="range-slider"></div>
<span class="slider-values"><span id="slider-value-lower">9:00</span><span> - </span><span id="slider-value-upper">17:00</span></span>
<script>
var snapSlider = document.getElementById('range-slider');
noUiSlider.create(snapSlider, {
start: [ 12, 18 ],
snap: true,
connect: true,
range: {
'min': 10,
'10%': 11,
'20%': 12,
'30%': 13,
'40%': 14,
'50%': 15,
'60%': 16,
'70%': 17,
'80%': 18,
'90%': 19,
'max': 20
}
});
var snapValues = [
document.getElementById('slider-value-lower'),
document.getElementById('slider-value-upper')
];
var timefield = document.getElementById('time');
timefield.value = '12:00 - 18:00';
snapSlider.noUiSlider.on('update', function( values, handle ) {
snapValues[handle].innerHTML = parseInt(values[handle]) + ':00';
timefield.value = parseInt(values[0]) + ':00 - ' + parseInt(values[1]) + ':00';
});
</script>
Тут добавить отсечки времени над каждым сверху
О-----------------------------О 12:00 - 18:00 и над левым сделать 12 над правым позунком 18 и при движении что бы менялся) можете дать пример или сказать как это сделать? я не знаю js учусь читаю только)
Спасибо!
