How to refresh cufon on an element?

Question

I have this code to initialize selectboxit plugin (to convert select box to spans etc.) and it shows thing in the select box using Myriad font. Thats nice. However, when I select some option, it change from Myriad to Verdana (default font). How to refresh the cufon? Cufon.refresh(); is not working.

My code:

<script>

        $(document).ready(function(){

          $("select").selectBoxIt();

          Cufon.replace('input.btn-submit', { fontFamily: 'Myriad Pro' });

          Cufon.refresh();

        });

</script>

Answer 1

Try refreshing the Cufont font each time the drop down changes. Like this:

        $(document).ready(function(){

          var select = $("select");

          select.selectBoxIt();

          refreshCufon();

          select.change(function() {

            refreshCufon();

          });          

          function refreshCufon() {

            Cufon.replace('input.btn-submit', { fontFamily: 'Myriad Pro' });

            Cufon.refresh();

          }

        });

</script>