字体切换+[兰陵]仿Key游戏风格jQuery右键菜单

最近一直在忙各种各样乱七八糟的事情,今天终于抽空,把承诺的切换字体的功能做了出来(不然总是有大(ji)佬(lao)看不惯我的字体 ̄﹃ ̄,当然也有喜欢的),这个功能其实很简单,可以参照我之前写的一篇给自己的博客添加夜间模式,两者是相同的思想,在这里就简单贴下代码,不懂的同学可以去那篇文章详细了解~

html<div class="ring">
	<a href="javascript:void(0)" title="" class="menuItem set-view-mode">
		<i class="fa fa-moon-o"></i>
	</a>
	<a href="javascript:void(0)" title="" class="menuItem set-font-mode">
		<i class="fa fa-font"></i>
	</a>
</div>.
PHP$(function(){
        //这是夜间模式的部分
        btn = $('.set-view-mode');
        if(sessionStorage.mode=="night"){
                $('body').addClass('night-mode');
                btn.find('i').attr('class','fa fa-sun-o');
        }
        $('.set-view-mode').click(function(){
                var next_mode = $('body').hasClass('night-mode') ? 'day' : 'night';
                if(next_mode!='day'){
                        $('body').addClass('night-mode');
                        btn.find('i').attr('class','fa fa-sun-o');
                        sessionStorage.mode="night";
                }else{
                        $('body').removeClass('night-mode');
                        btn.find('i').attr('class','fa fa-moon-o');
                        sessionStorage.mode="day";
                }
        });
        //这是切换字体的部分
        btn_2 = $('.set-font-mode');
        if(sessionStorage.mode_2=="other-font"){
                $('body').addClass('other-font');
        }
        $('.set-font-mode').click(function(){
                var next_mode_2 = $('body').hasClass('other-font') ? 'normal-font' : 'other-font';
                if(next_mode_2!='normal-font'){
                        $('body').addClass('other-font');
                        sessionStorage.mode_2="other-font";
                }else{
                        $('body').removeClass('other-font');
                                sessionStorage.mode_2="normal-font";
                }
        });
});
CSS.other-font {
	font:13px/25px Georgia, "Nimbus Roman No9 L", "Songti SC", Arial, Verdana, "Helvetica Neue", Helvetica, Tahoma, Georgia, "Nimbus Roman No9 L", "Songti SC", "Courier New", Times, Georgia, Georgia, "Nimbus Roman No9 L", "Songti SC", STSong, "AR PL New Sung", "AR PL SungtiL GB", NSimSun, SimSun, "TW\-Sung", "WenQuanYi Bitmap Song", "AR PL UMing CN", "AR PL UMing HK", "AR PL UMing TW", "AR PL UMing TW MBE", PMingLiU, MingLiU, sans-serif,Microsoft Yahei,Arial!important;
}

到这里,字体切换的功能就基本完成啦~\(≧▽≦)/~然后,因为觉得所有按钮都放右下角影响美观,就想起了之前看到的兰陵做的仿Key游戏风格jQuery右键菜单,简单修改了下就完成了这项功能,代码我就不贴了,预览图如下,大家可以根据自己的需要修改,下面是兰陵此项目的GitHub地址,感兴趣的同学可以前去下载,顺便给萌(si)萌(ji)哒(lao)兰陵点个star感谢下原作者( ๑´•ω•)

至此,字体切换+右键菜单两项功能就完成了!是不是很简单捏(ㆆᴗㆆ)