※ ChatGPTを利用し、要約された質問です(原文:ドラッグによるスライド移動をさせない方法(safari/chrome))
ドラッグによるスライド移動をさせない方法
このQ&Aのポイント
jQueryとEasySliderを使ったスライド内のテキストボックスのドラッグによる移動を防ぐ方法を教えてください。
SafariとGoogle Chromeでのみ発生する問題で、テキストボックスをドラッグしてスライド領域外に移動すると次のスライドに移動してしまいます。
テキストボックスのドラッグ移動を固定する方法をご教示いただければ幸いです。
ドラッグによるスライド移動をさせない方法(safari/chrome)
お世話になります。
早速ですが質問させていただきます。
jQuery1.3.2とEasySlider1.7プラグインを使っています。
EasySliderを使ったスライドの中にテキストボックスを配置しているのですが、
このテキストボックスでドラッグしてスライドの領域外へ移動させると
次のスライドへ移動してしまいます。
(safari と google chrome のみ)
これを移動させないよう固定する方法はありませんでしょうか?
以下にソースコードを載せておきます。
-------------------------------------------------------
<html>
<head>
<title>Easy Slider TEST</title>
<script type="text/javascript" src="lib/jquery/jquery-1.3.2.js"></script>
<script type="text/javascript" src="lib/jquery/easySlider1.7.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#slider").easySlider();
});
</script>
<style type="text/css">
#slider{}
#slider ul{
list-style-type:none;
margin:0px;
padding:0px;
}
#slider ul li{
height:100px;
width:300px;
}
</style>
</head>
<body>
<div id="slider">
<ul>
<li><div style="height:100%; background-color:#aaa;">
<input type="text" name="text" value="slide-1" />
</div></li>
<li><div style="height:100%; background-color:#bbb;">slide-2</div></li>
<li><div style="height:100%; background-color:#ccc;">slide-3</div></li>
</ul>
</div>
</body>
</html>
-------------------------------------------------------
■jQuery1.3.2■
http://docs.jquery.com/Release:jQuery_1.3.2
■EasySlider1.7■
http://cssglobe.com/post/5780/easy-slider-17-numeric-navigation-jquery-slider
以上、よろしくお願い致します。
補足
ご回答ありがとうございます。 mousemoveをキャンセルは思いつきませんでした。 $("#slider input").mousemove(function(){return false}); これでスライドが移動してしまうのは防げましたが、 ドラッグでのtextboxのテキスト選択ができなくなってしまいました;; 引き続き、何か対策が見つかりましたらご投稿願います。 よろしくお願い致します。