I've got a web app with two related UIs for adjusting a value. The first allows the user to add or subtract up to 100% of the amount. It's for an estimate, so rough ranges (e.g. every 10%) would be fine, or a continuous selection would work as well. The second selects a percentage of the available range in discrete steps e.g. 100%, 75%, 50%, 25%, 10%.
I've thought of two main UIs -- select boxes:
Note: in the range slider, the upper value will be locked to 100%. Also, FWIW, there will be several rows of these, if it makes a difference:
It seems to me that the advantages of the select boxes are that they're native controls, which always brings a certain richness of interaction, and they're perhaps a bit more explicit in their text. The sliders, OTOH provide a visual indicator, as well as a numeric one. Any other pros and cons of each design? Any other designs I should consider?