You can change the zoom level slider size by overriding default CSS classes. Refer to the style tag in the head of the sample for specifics.
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>Map Slider Position and Size</title> <link rel="stylesheet" href="https://js.arcgis.com/3.46/dijit/themes/claro/claro.css"> <link rel="stylesheet" href="https://js.arcgis.com/3.46/esri/css/esri.css"> <style> .esriLargeSliderVertical { height: 100px; } .esriLargeSliderTR { right: 10px; top: 10px; } #map { border:1px solid #000; height:250px; width: 250px; } </style> <script src="https://js.arcgis.com/3.46/"></script> <script> dojo.require("esri.map"); function init() { var map = new esri.Map("map", { showAttribution: false, sliderPosition: "top-right", sliderStyle: "large" }); map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer("https://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer")); } dojo.ready(init); </script> </head> <body class="claro"> Configure map slider's position and size <div id="map"></div> </body> </html>