软件标签: 弧形弹出菜单特效 js特效
jquery+css3动画弧形弹出菜单是js特效代码制作的一个菜单弹出效果,单击展开菜单,会扇形展开其下的子菜单,比较适用的移动端的软件制作,有需要的朋友欢迎来下载试用
js代码简介:
JS代码就是JavaScript编写的脚本文件的代码。用单独文件保存,扩展名为.JS
JS即Javascript,Javascript是一种由Netscape的LiveScript发展而来的脚本语言,主要目的是为了解决服务器终端语言,比如Perl,遗留的速度问题。当时服务端需要对数据进行验证,由于网络速度相当缓慢,只有28.8kbps,验证步骤浪费的时间太多。于是Netscape的浏览器Navigator加入了Javascript,提供了数据验证的基本功能。
代码引用:
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
(function(){
var ul=$("#navs"),li=$("#navs li"),i=li.length,n=i-1,r=120;
ul.click(function(){
$(this).toggleClass('active');
if($(this).hasClass('active')){
for(var a=0;a<i;a++){
li.eq(a).css({
'transition-delay':""+(50*a)+"ms",
'-webkit-transition-delay':""+(50*a)+"ms",
'-o-transition-delay':""+(50*a)+"ms",
'transform':"translate("+(r*Math.cos(90/n*a*(Math.PI/180)))+"px,"+(-r*Math.sin(90/n*a*(Math.PI/180)))+"px",
'-webkit-transform':"translate("+(r*Math.cos(90/n*a*(Math.PI/180)))+"px,"+(-r*Math.sin(90/n*a*(Math.PI/180)))+"px",
'-o-transform':"translate("+(r*Math.cos(90/n*a*(Math.PI/180)))+"px,"+(-r*Math.sin(90/n*a*(Math.PI/180)))+"px",
'-ms-transform':"translate("+(r*Math.cos(90/n*a*(Math.PI/180)))+"px,"+(-r*Math.sin(90/n*a*(Math.PI/180)))+"px"
});
}
}else{
li.removeAttr('style');
}
});
})($);
</script>
∨ 展开