javascript - Set background-image for button to element already contained within page -



javascript - Set background-image for button to element already contained within page -

basically want specify background-image button using other image url. beingness able set background-image loaded element contained within dom ideal. can cache loading gif (displayed on button) within dom , don't have fetch when button clicked.

i didn't think code necessary illustrate problem here anyway

not ideal due image loading on click:

that.submitbuttonselector.css('background-image', 'url(/content/_activity/ajax-loader.gif)');

ideal (but no obvious way achieve)

that.submitbuttonselector.css('background-image', '#precachedimage');

if load loading gif via url, cached in cases. need download once. after served cache. other thing can think of utilize base64 source. has benefit if not generating http request, larger when comes actual bytes (i don't think larger size slower http request, can benchmark them).

in experience believe base64 images great if need show loading icon , if icon little enough, if don't need show right away, suggest preloading image via url javascript , relying on cached version.

so in case, if went base64, use

that.submitbuttonselector.css('background-image', 'url(data:image/gif;base64,r0lgodlheaaqapiaap///waaamlcwkjcqgaaagjiyokcgpkskih+gknyzwf0zwqgd2l0acbhamf4bg9hzc5pbmzvach5baakaaaaif8ltkvuu0nbueuyljadaqaaacwaaaaaeaaqaaadmwi63p4wyklre2mioggznadomgyjrbexwroumcg2lmdewnhqlvsyod2mbzkydadka+diaaah+qqacgabacwaaaaaeaaqaaadnai63p5ojcegg4qmu7dmikrxqlfuydezigbmrvsaqhwctxxf7weyb4ag1xjihkmzsiukkhiaifkeaaoaagasaaaaabaaeaaaazyiujijk8pbyjdmlfyvbovjha70gu7xsujhmktwhpakzlo9hmaokwjz7rf8aypddzkpzbqfvwqaifkeaaoaawasaaaaabaaeaaaazmiumilk8oyhphsnfzfhyumcyuhdaqxridhhbgqrokw0r8dyljd8z0fmdgsgo/iphi5taaaifkeaaoabaasaaaaabaaeaaaaziiunink0rnzbtwgpnmgqwmdsngxgjuliweur5owuipz8paeame6twfwyysgo/ipfksaaah+qqacgafacwaaaaaeaaqaaadmwi6imkqorfjdoe82p4wgccc4ceuqradylesojembgsuc2g7sdx3lqgbmlajibufbslkaaah+qqacgagacwaaaaaeaaqaaadmgi63p7wcrhznfvdmghu2nfwlwci3wgc3tswhufgxtaukgcbtgenbmjaejsxgmlwzpeaach5baakaacalaaaaaaqabaaaamyclrc/jdksatlqtsckdcecajdii7hcq4emtcpyrcuubjcyrghvtqlaib1yhicnlsrkaaaowaaaaaaaaaaaa==)');

class="snippet-code-css lang-css prettyprint-override">body:after { content: url(data:image/gif;base64,r0lgodlheaaqapiaap///waaamlcwkjcqgaaagjiyokcgpkskih+gknyzwf0zwqgd2l0acbhamf4bg9hzc5pbmzvach5baakaaaaif8ltkvuu0nbueuyljadaqaaacwaaaaaeaaqaaadmwi63p4wyklre2mioggznadomgyjrbexwroumcg2lmdewnhqlvsyod2mbzkydadka+diaaah+qqacgabacwaaaaaeaaqaaadnai63p5ojcegg4qmu7dmikrxqlfuydezigbmrvsaqhwctxxf7weyb4ag1xjihkmzsiukkhiaifkeaaoaagasaaaaabaaeaaaazyiujijk8pbyjdmlfyvbovjha70gu7xsujhmktwhpakzlo9hmaokwjz7rf8aypddzkpzbqfvwqaifkeaaoaawasaaaaabaaeaaaazmiumilk8oyhphsnfzfhyumcyuhdaqxridhhbgqrokw0r8dyljd8z0fmdgsgo/iphi5taaaifkeaaoabaasaaaaabaaeaaaaziiunink0rnzbtwgpnmgqwmdsngxgjuliweur5owuipz8paeame6twfwyysgo/ipfksaaah+qqacgafacwaaaaaeaaqaaadmwi6imkqorfjdoe82p4wgccc4ceuqradylesojembgsuc2g7sdx3lqgbmlajibufbslkaaah+qqacgagacwaaaaaeaaqaaadmgi63p7wcrhznfvdmghu2nfwlwci3wgc3tswhufgxtaukgcbtgenbmjaejsxgmlwzpeaach5baakaacalaaaaaaqabaaaamyclrc/jdksatlqtsckdcecajdii7hcq4emtcpyrcuubjcyrghvtqlaib1yhicnlsrkaaaowaaaaaaaaaaaa==) }

javascript jquery html css

Comments

Popular posts from this blog

Delphi change the assembly code of a running process -

json - Hibernate and Jackson (java.lang.IllegalStateException: Cannot call sendError() after the response has been committed) -

C++ 11 "class" keyword -