论坛首页 Web前端技术论坛

Font-Awesome在ie7下不能toggle图标解决方案

浏览 4042 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2013-03-05   最后修改:2013-03-05

问题:

Font-Awesome字体在ie7上不能toggle,原因是Font-Awesome在ie7上使用expression完成显示的。目前网上有很多遇到的但没找到解决方案。

 

解决方案:

比较蠢,采用clone/append完成class的toggle。目前只想到这种方案。欢迎更完美的解决方案。

 

html

<a class="btn btn-link icon-plus-sign"></a>

 

js

$(function() {
    $(".btn").click(function() {
		$(".btn").each(function() {
		    //如果是ie7
			if(/MSIE 7.0/ig.test(navigator.appVersion)) {
				var $aClone = $(this).clone(true);
				if($aClone.hasClass("icon-minus-sign")) {
					$aClone.addClass("icon-plus-sign").removeClass("icon-minus-sign");
				} else {
					$aClone.addClass("icon-minus-sign").removeClass("icon-plus-sign");

				}
				$(this).after($aClone);				
				$(this).remove();

			} else {
  			    $a.toggleClass(openIcon);
                $a.toggleClass(closeIcon);
			}
			
		});

		return false;

	});
});

 

  最后必须return false; 否则会造成ie7浏览器crash掉。

论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics