Change objects opacity

Change opacity with range slider

<!DOCTYPE html>
<meta charset="utf-8">
<head>
    <link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
    <style>
        body {font-size: 20px; font-family: 'Raleway', sans-serif; vertical-align: middle;}
        .leftlabel, .rightlabel {  
            width: 50px;
            padding: 2px;
            text-align: center;
        }

</style>

</head>
<body>
    <script src="//d3js.org/d3.v4.min.js"></script>
    <div id="objects"></div>
    <div style="margin-left: 150px; margin-top: 2px;">
  
        <span class="leftlabel">0</span>
        <input id ="range1" type="range" min="0" max="100" value="100" style="width: 400px; margin-right: 10px;"/>
        <span class="rightlabel">100</span>
    </div>
    <script>
    var width = 800,
        height = 340;

var svg = d3.select("#objects").append("svg")
                .attr("width", width)
                .attr("height", height);

//Make a circles
    svg.append("circle")
        .attr("cx", width/6)
        .attr("cy", 200)
        .attr("r", 60)
        .attr('id', "c1")
        .style("opacity", 1.0)
        .style("fill", "#f46d43");

svg.append("circle")
    .attr("cx", 2*width / 6)
    .attr("cy", 200)
    .attr("r", 60)
    .style("opacity", 1.0)
    .style("fill", "#f46d43");

svg.append("circle")
        .attr("cx", 3*width / 6)
        .attr("cy", 200)
        .attr("r", 60)
        .style("opacity", 1.0)
        .style("fill", "#f46d43");

svg.append("circle")
        .attr("cx", 4*width / 6)
        .attr("cy", 200)
        .attr("r", 60)
        .style("opacity", 1.0)
        .style("fill", "#f46d43");

svg.append("circle")
        .attr("cx", 5*width / 6)
        .attr("cy", 200)
        .attr("r", 60)
        .style("opacity", 1.0)
        .style("fill", "#f46d43");

d3.select("#range1").on("input", function () {

svg.selectAll('circle')
                    .transition()
                    .duration(1000)
                    .ease(d3.easeLinear)
                    .style("opacity", d3.select("#range1").property("value")/100);
    });

</script>
</body>

https://d3js.org/d3.v4.min.js