基于CSS结合JavaScript实现的一款极具创意的拉伸传递效果单选按钮，进行单选选择时，会有一个从上次选中选项区域到当前选中选项区域的一个拉伸动画效果，并使「选项」下落到选中位置。交互性和趣味性十足的一款单选按钮。实现起来也很简单，HTML中只需要简单的定义单选按钮即可，然后通过CSS实现单选按钮的初始状态，最后通过JavaScript响应单选按钮的切换事件并控制CSS变量实现拉伸效果。

<form>
    <label>
       <input type="radio" name="os" data-option="0" value="windows" checked>
       Windows
    </label>
    <label>
       <input type="radio" name="os" data-option="1" value="mac">
       Mac
    </label>
    <label>
       <input type="radio" name="os" data-option="2" value="linux">
       Linux
    </label>
</form>