adding custom image to jquery button -


i trying add image button using jquery, tried same example https://forum.jquery.com/topic/custom-icons-on-jquery-ui-button, not working me. link plunker http://plnkr.co/edit/pjsmczsr0fag2sgo6utk?p=preview

updated url image file. here code

    <!doctype html> <html> <head> <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/smoothness/jquery-ui.css" /> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>  <style>  .ui-wp-icon {     background-image: url(http://findicons.com/files/icons/1714/dropline_neu/128/edit_undo.png) !important; } </style>     <script>  $(document).ready(function(){        $( "#wpbutton" ).button({         icons: { primary: "ui-wp-icon"}         }); });  </script> </head> <body> <button id="wpbutton">wordpress</button> </body> </html>

first of all, .ui-icon class on button sets background position 16px 16px. remove class, or overwrite in css using:

background-position: 0 0;

also, image lot bigger space should fit in. see top left bit, transparent. set background size fit inside icon element:

background-size: contain;

so css becomes:

.returnicon {     background-image: url(http://findicons.com/files/icons/1714/dropline_neu/128/edit_undo.png) !important;     background-position: 0 0;     background-size: contain }

Comments

Post a Comment

Popular posts from this blog

php - Submit Form Data without Reloading page -

i know question has been asked , answered bunch of times life of me can not solution work on code. believe if redo code, work properly, , in retrospect time i've spent on issue should have redone code...but beyond deadline , have working prototype up... can advise how update multiple forms on single page without reloading page? horrible @ php , complete noob js/jquery/ajax @ best. html/php in single file , believe causing me problems/is largest obstacle @ getting ajax form processing work. basically, want users to: select teams multiple dropdowns in form group 1 (league champs) , on update update db newly selected team without reloadding page. edit team scores per match , on score submit/update, update db new scores. for each requirement there multiple forms (1 each leagues, 1 each per match) have set class on each form id. everything works via php, form submission reloads page each time submitted , not ideal. i have tried ajax code here http://scotch.io/tutoria...
Read more

linux - Rails running on virtual machine in Windows -

the reason why want switch ubuntu people said gems works better on linux on windows. i don't want macbook pro rails development since love windows , cannot stand lack of apps mac. moreover, people saying ubuntu "better" mac: http://www.reddit.com/r/ubuntu/comments/1bgj1s/are_there_advantages_of_ubuntu_over_os_x_for/ does virtual box work enough doesn't have lag @ all? using i7-3517u cpu 8gb memory. need program in environment lag-free , not sluggish. or there alternatives recommend? i unsure permission settings or complicated stuffs regarding terminal. i'll using terminal develop. i'm still quite new here development in linux. please kind me >< thanks. @holyxiaoxin pretty sure should asking on superuser instead. nevertheless, suggest install ubuntu in partition instead of running virtual machine. here's guide https://help.ubuntu.com/community/windowsdualboot also, yes. developing in virtual machine accurate, @ end experiment w...
Read more