css - Error JQuery on Font Awesome Icon -


i creating jquery sliding navigation using font awesome (see: http://fortawesome.github.io/font-awesome/)

now upon adding css since third party web fonts icons wonder how can apply own code using + , - icon. used image icons before planning integrate web icons.

my jquery code is.

$("#toggle > li > div").click(function(){     if(false == $(this).next().is(':visible')) {         $('#toggle ul').slideup();           $("span.minus-btn").removeclass('minus-btn');     }     $(this).next().slidetoggle(); });  $("#toggle > li > div").click(function() {           $("#toggle > li > div").removeclass("active");          $(this).addclass('active');  if($(this).hasclass("active")){        $("span.plus-btn", this).toggleclass('minus-btn');          } }); 

now stock don't know how fix sizes of icons. please help.

here's jquery fiddle link: http://jsfiddle.net/sg7lz/6/

any great + explanation please?

please show me solution on jsfiddle can check on code , results.

a big thanks!

you can add same style font-size attribute used fot main icons, css like:

span.plus-btn{     float: right;     font-size: 26px;     height: 30px;     width: 43px;     margin-top: -34px;     padding:0;     color: #fff; } 

finally have rewrite code let icon toggle works.

in code take reference in variable of current menu icon $curricon=$(this).find("span.the-btn > i") change icons, not current in compressed state (plus).

now using toggleclass siwtch plus/minus icons on stored element $curricon

demo: http://jsfiddle.net/npnxt/


Comments

Popular posts from this blog

Android layout hidden on keyboard show -

google app engine - 403 Forbidden POST - Flask WTForms -

c - Why would PK11_GenerateRandom() return an error -8023? -