タグ

ブックマーク / gihyo.jp (1)

  • 第23回 JavaScriptによるUIの実装:スライダー | gihyo.jp

    こんにちは、前回、前々回に引き続き、JavaScriptUIを実装する方法を紹介していきます。今回は前回のドラッグと関連の深いスライダーを実装してみます。 基のスライダー スライダーは簡単にいえば動きの制限されたドラッグです。 今回も、最初はなるべくシンプルに実装してみます。まず、基となるHTMLは次の通りです。 スライダーの基HTML <form class="js-slider-form" onsubmit="return false;"> <input type="text" name="slider" id="slider1o" value="0"> <div id="slider1" class="js-slider"> <div></div> <input type="button" value=""> </div> </form> 今回は少々手抜きで、input ty

    第23回 JavaScriptによるUIの実装:スライダー | gihyo.jp
    etsukun
    etsukun 2014/05/18
    “回はこのtype="range"になるべく合わせるように実装してみます(ただし,この記事ではtype=rangeが持っているstepや,stepDown(),stepUp()などのメソッドはサポートしませんし,横へのスライド限定です。是非,それらに挑”
  • 1