http:https://dl.dropboxusercontent.com/u/695740/webaudio-slider/index.html
- load polymer.js
- link to webaudio-knob component
<script src="[PathTo]/polymer.js">
<link rel="import" href="[PathTo]/knob.html">
- insert
webaudio-sliderelement
<webaudio-slider id="hoge02" class="hoge02" basesrc="images/fader-base03.jpg" knobsrc="images/fader-knob03.jpg" value="40" min="0" max="100" step="1" basewidth="76" baseheight="300" knobwidth="35" knobheight="50" ditchLength="230"></webaudio-slider>
- create imperatively
var slider = document.createElement('webaudio-slider');
- value can be changed by simply dragging up and down
description: min value of the slider
default: 0
description: max value of the slider
default: 100
description: value of the slider
default: 0
description: value change steps by moving mouse
default: 1
description: width of slider's baseimage
default: 0
description: height of slider's baseimage
default: 0
description: width of slider's knobimage
default: 0
description: height of slider's knobimage
default: 0
description: lenght of slider's dithch. Please adjust this value when the knob is pushed out from baseimage.
default: 0
description: path to slider's base image resource (relative from where you are refering)
default: null
description: path to slider's base image resource (relative from where you are refering)
default: null
description: 'change' event emitted everytime value changes
var slider = document.getElementsByTagName('[id name of your slider element]');
slider.addEventListener("change", function(){
console.log(this.value);
});
The Apache License Version 2.0