多くのメソッドが見つかりましたが、一部は実装されておらず (スクロールされるコンテンツの幅は不明ですが、このメソッドを使用する場合は知っておく必要があります)、その他はこれらのブラウザー (IE6、Firefox、Chrome) と完全に互換性がありません。最終的には、JQuery の Slider コントロールを使用することにしました。 1. jquery-1.3.2.min.js、jquery-ui-1.7.1.custom.min.js をダウンロードします 2. HTML コードをコピーします コードは次のとおりです: スクロールコンテンツ 3. css コードをコピーします コードは次のとおりです: <br>#topslider { <br>width: 98% ; <br>高さ: 6px; <br>位置: 相対; <br>#bottomslider { <br>高さ: 6px; >背景: #BBBBBB; <br>位置: <br>} <br>幅: 8px; <br>位置: 絶対; >トップ: -4px; <br>背景: #478AFF; <br>ボーダー: 1px 黒; <br>#scroll { <br>幅: 100%; <br>マージントップ: 10px; <br>オーバーフロー: 非表示 <br>} <br>#holder { <br>width: 100%; <br>} <br><br> <br>4. 🎜><br><br><br><br>コードをコピーします<br><br><br> コードは次のとおりです:<br> </div> <br><script type="text/javascript" src="JavaScript/jquery-1.3.2 .min.js"></script> <br><script type="text/javascript" src="JavaScript/jquery-ui-1.7.1.custom. min.js"></script> ; <div class="codetitle">$(document).ready(function(){ <span>$("#topslider").slider({ <a style="CURSOR: pointer" data="15750" class="copybut" id="copybut15750" onclick="doCopy('code15750')">animate: true, <u>change : handleSliderChange, </u>slide: handleSliderSlide, </a>stop:handleTopSliderStop </span>}); </div>$("#bottomslider").slider({ <div class="codebody" id="code15750">animate: true, <br>change: handleSliderChange, <br>スライド: handleSliderSlide, <br> stop:handleBottomSliderStop <br>}) <br>}); <br>function handleSliderChange(e, ui) <br>{ <br>var maxScroll = $("#scroll ").attr("scrollWidth") - $("#scroll").width(); <br>$("#scroll").animate({scrollLeft: ui.value * (maxScroll / 100) }, 1000 ); <br>} <br>関数 handleSliderSlide(e, ui) <br>{ <br>var maxScroll = $("#scroll").attr("scrollWidth") - $("#scroll").width (); <br>$("#scroll").attr({scrollLeft: ui.value * (maxScroll / 100) }); <br>} <br>関数 handleTopSliderStop(e, ui) <br>{ 🎜>$("#bottomslider").slider('value',$("#topslider").slider('value')); <br>} <br>関数 handleBottomSliderStop(e, ui) <br>{ <br>$("#topslider") .slider('value',$("#bottomslider").slider('value')); <br>} <br><br> </div>