Flash基础入门之HTML——动画效果：左侧固定悬浮栏（图标控制）-职坐标

Flash基础入门之HTML——动画效果：左侧固定悬浮栏（图标控制）

小标 2019-01-24 来源：阅读 1626 评论 0

摘要：本文主要向大家介绍了Flash基础入门之HTML——动画效果：左侧固定悬浮栏（图标控制），通过具体的内容向大家展现，希望对大家学习Flash基础入门有所帮助。

本文主要向大家介绍了Flash基础入门之HTML——动画效果：左侧固定悬浮栏（图标控制），通过具体的内容向大家展现，希望对大家学习Flash基础入门有所帮助。

效果：

默认时：

点击按钮时

html：

<!DOCTYPE html><html><head><title>智能家居</title>
<link href="images/xiaotubiaologo.ico" rel='icon' type='image/x-icon'/>

<meta name="viewport" content="width=device-width, initial-scale=1"><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="keywords" content="Cfion Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" /><script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script><link href='//fonts.useso.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'><link href="css/bootstrapchenbiaotilan.css" rel="stylesheet" type="text/css" media="all" /> <link href="css/styleCHEN.css" rel="stylesheet" type="text/css" media="all" /><link rel="stylesheet" type="text/css" href="css/componentCHEN.css" /> </head><body><div class="content1">
<div class="services-section1" id="services">
<div class="container1">
<div class="cbp-spmenu-push">
<nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left" id="cbp-spmenu-s2">
<div class="logo1">
<a href="index.html"><img src="images/xiaotubiao.png"></a>
</div>
<ul>
<li><a href="index.html" class="scroll">Home</a></li>
<li><a href="#services" class="scroll">Services</a></li>
<li><a href="#about" class="scroll">About</a></li>
<li><a href="#portfolio" class="scroll">Portfolio</a></li>
<li><a href="#testimonials" class="scroll">Testimonials</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>

<div class="main1">
<section>
<button id="showRight"><img src="images/xiaotubiao.png"></button>
</section>
</div>
</div>
<script src="js/classieCHEN.js"></script>
<script>
var menuRight = document.getElementById( 'cbp-spmenu-s2' ),
showRight = document.getElementById( 'showRight' ),
body = document.body;

showRight.onclick = function() {
classie.toggle( this, 'active' );
classie.toggle( menuRight, 'cbp-spmenu-open' );
disableOther( 'showRight' );
}; function disableOther( button ) { if( button !== 'showRight' ) {
classie.toggle( showRight, 'disabled' );
}
} </script>

</body></html>