topic Re: ArcGIS Javascript API change Home Button image in HTML5, CSS, JavaScript, and JavaScript Frameworks

ArcGIS Javascript API change Home Button image

JosephRogan — Wed, 20 May 2015 17:34:47 GMT

How can I change the image/icon of the HomeButton (and other) widgets easily using the ArcGIS Javascript API? Do I need to need to follow something like the "Create a Re-usable Widget" guide, or is there an nice easy way to just specify my own image url?

Thanks!

Re: ArcGIS Javascript API change Home Button image

TimWitt2 — Wed, 20 May 2015 17:38:54 GMT

Joseph,

check this out: Custom styling for HomeButton

and here: How to get the Home button between the two default zoom sliders?

Tim

Re: ArcGIS Javascript API change Home Button image

JosephRogan — Wed, 20 May 2015 17:41:16 GMT

Thanks!

Re: ArcGIS Javascript API change Home Button image

ChrisSergent — Thu, 21 May 2015 21:27:28 GMT

If this worked for you I can mark Tim Witt's answer as correct. I don't know if you see that option since I created this group.

Re: ArcGIS Javascript API change Home Button image

JosephRogan — Thu, 21 May 2015 21:38:07 GMT

Yes, that helped. In addition to the info in the links I also added some css, because by removing the span's text, there was essentially no element left to click on and trigger the action of the home button. I had to make the span's text cover the entire button, not overflow, be transparent and not selectable. Actually there was a little more because I had to make the selectable text transparent as well since my work only uses ie9 and some of those items don't work.

.customButton span {

color: rgba(0,0,0,0);

line-height: 35px;

display:block;

overflow:hidden;

-webkit-touch-callout: none;

-webkit-user-select: none;

-khtml-user-select: none;

-moz-user-select: none;

-ms-user-select: none;

user-select: none;

}