11、所有控制栏 - 博客界面改造文章(202203)

       此文写的是所有控制栏的效果。

       一、顶部的菜单栏；

       顶部菜单栏的HTML代码，见页首HTML代码的定义里。

二、右侧控制栏，包括一个提示栏和一个操作栏；

<!--右侧的触发栏-->

<div class="rightTrigger">

</div>

<!--右侧的菜单控制栏-->

<div id="divrightControl" class="rightControl">

       <div class="iCtrlTop">

              <a id="aGoTop" title="返回顶部" href="#gotop"><img width="50px" height="50px" src="https://images.cnblogs.com/cnblogs_com/lzhdim/202430/o_220321131941_goTop.png"></a>

       </div>

       <div class="iCtrlCenter">

              <a id="aGoCenter" onclick="$.FN_LightTime.LightTimes($($('#rightLogo')),2)" href="javascript:void(0)"><img id="rightLogo" width="50px" height="50px" src="https://images.cnblogs.com/cnblogs_com/lzhdim/202430/o_220322130416_eye.jpg"></a>

       </div>

       <div class="iCtrlBottom">

              <a id="aGoBottom" title="转到底部" href="#gobottom"><img width="50px" height="50px" src="https://images.cnblogs.com/cnblogs_com/lzhdim/202430/o_220321131951_goBottom.png"></a>

       </div>

</div>

三、底部的版权栏。

       底部的版权栏，见页脚的HTML代码定义。

 

       三个控制栏的效果见页面的效果。

       https://files.cnblogs.com/files/lzhdim/jquery.lighttime.js?t=1648030653

       https://files.cnblogs.com/files/lzhdim/BlogFrame.js?t=1648104915

       https://files.cnblogs.com/files/lzhdim/TopMenu.css?t=1648103468

       https://files.cnblogs.com/files/lzhdim/RightControlTrigger.css?t=1648103520

       https://files.cnblogs.com/files/lzhdim/BottomMenu.css?t=1648129134

       CSS直接放在页面HTML代码中文件链接即可。JS也直接放到文件中，然后在页面加载完成时中进行设置。