Change position of simple zoom slider

[NickHarvey]

I would like to adjust the position and appearance of the +/- zoom tool in my application.   I wanted to adjust the height of the header controller (make it thicker).  I have managed to adjust the position of the geocoding widget (to move it down to account for the thicker header controller). This positional reference is found in the config.json.  Then I started looking for the +/-zoom slider.  I'm missing something....Can't seem to find the positional reference for the simple zoom slider.  When I inspect this element in Chrome it is referred to as a div entitled "map_zoom_slider". So, maybe its not an exposed widget whose style and position can be customized (?).  Is the zoom slider inherited from the AGOL web map, or perhaps I still haven't found the right file to manipulate.  I'm speculating.....so its time to ask the experts.......Any suggestions or workarounds are appreciated....

thanks!

-Nick   

[RobertScheitlin__GISP · Accepted solution]

Nick,

  You can adjust the simpleslider by changing the css. Go to "[install location]\server\apps\[App#]\jimu.js\css\jimu.css and find this:

.esriSimpleSliderTL{
  top: 5px;
  left: 7px;
  border: 0px solid #666;
  background-color: rgba(255, 255, 255, 0.3);
}

And just adjust the top property to your liking.

[NickHarvey]

That worked - Thanks Robert!

[JunshanLiu]

Use .esriSimpleSliderTL to adjust zoom slider position is the correct way in old version. In the latest release, you should change position in app widget config because we have created a ZoomSlider widget.

[RebeccaStrauch__GISP]

Junshan, it there an anticipated release date yet?

[JunshanLiu]

When can we expect the July release of Developer Edition WAB?