By default, the zoom level slider is oriented vertically. You can orient the slider horizontally by setting the constructor options to customize the map's slider.
var map = new esri.Map("map", {
sliderOrientation: "horizontal",
sliderPosition: "bottom-left",
sliderStyle: "large"
});
<!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>Change Map Slider Orientation</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"> <script src="https://js.arcgis.com/3.46/"></script> <script> dojo.require("esri.map"); function init() { var map = new esri.Map("map", { sliderOrientation: "horizontal", sliderPosition: "bottom-left", 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 orientation <div id="map" style="width:500px; height:500px; border:1px solid #000;"></div> </body> </html>