모바일 터치 기능?
본문
안녕하세요 문의좀드리겠습니다.
http://www.uhoon.co.kr/test/3377.html
위가 참고링크인데요
슬라이더 ui를 모바일로 볼시 터치로 이동이 안되더라구요
pc에서는 잘되는데 모바일에서도 가능하게끔 할 수 있는방법이있을까요?
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Slider</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<script>
$(function() {
$("#slider-range-max").slider({
range: "max",
min: 1,
max: 10,
value: 2,
slide: function(event, ui) {
$("#amount").val(ui.value);
}
});
$("#amount").val($("#slider-range-max").slider("value"));
$("#slider-range").slider({
range: true,
min: 0,
max: 500,
values: [75, 300],
slide: function(event, ui) {
$("#amount2").val("$" + ui.values[0] + " - $" + ui.values[1]);
}
});
$("#amount2").val("$" + $("#slider-range").slider("values", 0) + " - $" + $("#slider-range").slider("values", 1));
$("#slider").slider({
value:10,
min: 0,
max: 100,
step: 10,
slide: function( event, ui ) {
$( "#amount3" ).val( "$" + ui.value );
}
});
$( "#amount3" ).val( "$" + $( "#slider" ).slider( "value" ) );
});
</script>
</head>
<body>
<div style="padding:20px;text-align:center;">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- source.uhoon.co.kr -->
<ins class="adsbygoogle"
style="display:inline-block;width:468px;height:60px"
data-ad-client="ca-pub-4169082997566429"
data-ad-slot="5725636632"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
<p>
<input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>
<div id="slider-range-max"></div>
<p>
<input type="text" id="amount2" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>
<div id="slider-range"></div>
<p>
<input type="text" id="amount3" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>
<div id="slider"></div>
</body>
</html>
답변을 작성하시기 전에 로그인 해주세요.
