189 8069 5689

三、CSS样式

body {
	margin: 0;
}
body{
	background-color:#eee;}
#stage {
	width: 300px;
	height: 300px;
	position: relative;
	top: 150px;
	margin: 0 auto;
}
#nav {
	position: absolute;
	width: 120px;
	height: 107px;
	left: 50%;
	margin-left: -60px;
	top: 50%;
	margin-top: -53px;
}
#nav img {
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	cursor: pointer;
}
#home {
	position: absolute;
	width: 150px;
	height: 134px;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	cursor: pointer;
	transition: 0.5s ease-in-out;
	
}
#home img {
	width: 100%;
}

四、JavaScript源代码

window.onload=function(){
	var oHome=document.getElementById("home");
	var oNav=document.getElementById("nav");
	var aImg=oNav.getElementsByTagName("img");
	var imgLen=aImg.length;
	var onOff=true;
	var iR=-260;
	
	//鼠标点击每个小图标的时候
	for(var i=0;i
完整页面代码











        
    


感谢各位的阅读！关于“css3如何利用transform变形结合事件完成扇形导航”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，让大家可以学到更多知识，如果觉得文章不错，可以把它分享出去让更多的人看到吧！
            

            网页标题：css3如何利用transform变形结合事件完成扇形导航-创新互联            

            网站链接：http://cdxtjz.cn/article/dosdhe.html
        
    
    

        
其他资讯
        

            

                    南山网站建设多少钱，南山建网站多少钱
                

                    域名如何才能访问,要输入域名需解析域名绑定服务器端先生效
                

                    设置页面图，word怎么设置页面背景图片的两种方法
                

                    mysql内存设置，如何增大MYSQL内存
                

                    mil域名网站有哪些，美丽说论坛网址是什么