资源来源网络,如果需要授权,请大家更换源码,模块仅供学习,下载后请2小时内删除,如需商用请购买正版授权
HTML代码
<a class="design-reference" href="//100daysui.com/#cbp=ajax/shot-90" target="_blank">100 Days UI Challenge - Day 90</a> <div class="component"> <aside> <div class="preamp"> <label>preamp</label> </div> </aside> <main> <div class="presets"> <label>Presets:</label> <select name="Custom" onchange="app.selectPreset(this)"> <option value="custom">Custom</option> <option value="rock">Rock</option> <option value="pop">Pop</option> <option value="pop">Classical</option> <option value="pop">Disco</option> </select> <button class="reset" onclick="app.reset()">Reset</button> </div> <div class="sliders"> <svg preserveAspectRatio="none" viewBox="0 0 140 100"> <path d="" class="line-shadow"></path> <path d="" class="line"></path> </svg> <div class="range-slider"> <input type="range" orient="vertical" min="0" max="100" /> <div class="range-slider__bar"></div> <div class="range-slider__thumb"></div> </div> <div class="range-slider"> <input type="range" orient="vertical" min="0" max="100" /> <div class="range-slider__bar"></div> <div class="range-slider__thumb"></div> </div> <div class="range-slider"> <input type="range" orient="vertical" min="0" max="100" /> <div class="range-slider__bar"></div> <div class="range-slider__thumb"></div> </div> <div class="range-slider"> <input type="range" orient="vertical" min="0" max="100" /> <div class="range-slider__bar"></div> <div class="range-slider__thumb"></div> </div> <div class="range-slider"> <input type="range" orient="vertical" min="0" max="100" /> <div class="range-slider__bar"></div> <div class="range-slider__thumb"></div> </div> <div class="range-slider"> <input type="range" orient="vertical" min="0" max="100" /> <div class="range-slider__bar"></div> <div class="range-slider__thumb"></div> </div> <div class="range-slider"> <input type="range" orient="vertical" min="0" max="100" /> <div class="range-slider__bar"></div> <div class="range-slider__thumb"></div> </div> </div> </main> </div>