管理

随笔分类 -  【108】博客界面改造文章

摘要:上次逛博客园,有一个园友的博客吸引了我,它那个也自己更改了博客效果,看到他的博客图标已经改成自定义的了。然后我就找了它的JS代码,不过他那个是一个类,挺大,于是我就百度了一下,将个人博客图标更改的方法发布如下: <!-- 修改网页图标为自定义图标 --> <script type="text/jav 阅读全文

posted @ 2024-02-16 22:44 lzhdim 阅读(7612) 评论(0) 推荐(0) 编辑

摘要:最近闲来无事,就想着把博客界面弄得再有点动画效果,于是就找了延迟函数,把博客的内容列表加载的动画写出来了。 该动画效果还是挺炫的,但是因为刷新页面,下面列表的显示需要拉动到底下才看到,所以这里只能记录一下了。 下面是实现的函数: JS文件在这里,需要的读者自己下载查看: https://files. 阅读全文

posted @ 2023-07-30 17:18 lzhdim 阅读(11735) 评论(0) 推荐(0) 编辑

摘要:这天看到一个网页飘叶效果,就放到自己的博客中了,具体看博客界面的效果。 直接把下列的JavaScript代码放到页面中即可。 <script src="https://files.cnblogs.com/files/lzhdim/fallingeffect.js"></script> 阅读全文

posted @ 2022-11-04 15:39 lzhdim 阅读(9072) 评论(0) 推荐(0) 编辑

摘要:写到这里,此系列的的博文已经完毕。当然,这个是2022年3月份的博客界面效果升级改造文章。后续如果再对博客界面进行升级改造,那再写此系列的文章。 感谢博客园给了我们这个记录博文的地方,也感谢这个博客园能够对博客界面进行升级改造,让前端工程师能够将博客的界面进行修改,以实现博主自己的博客界面效果。 阅读全文

posted @ 2022-04-26 11:55 lzhdim 阅读(9058) 评论(0) 推荐(0) 编辑

摘要:此文写的是此系列的效果的页面加载完成时的代码。 这些个效果,在页面加载完成时事件里绑定相关的时间,以及配置和运行相关的JS脚本代码。 这里就不将代码贴出来了。 https://files.cnblogs.com/files/lzhdim/PageReady.js?t=1648108560 https 阅读全文

posted @ 2022-04-26 11:53 lzhdim 阅读(9051) 评论(0) 推荐(0) 编辑

摘要:此文写的是页面的鼠标效果。 1、 CSS样式表; https://files.cnblogs.com/files/lzhdim/cursorEffectCSS.css?t=1648103787 样式表直接放到HTML代码中。笔者放的是页首HTML代码中。 2、 JS脚本; https://files 阅读全文

posted @ 2022-04-25 10:26 lzhdim 阅读(9111) 评论(0) 推荐(0) 编辑

摘要:此文写的是所有控制栏的效果。 一、顶部的菜单栏; 顶部菜单栏的HTML代码,见页首HTML代码的定义里。 二、右侧控制栏,包括一个提示栏和一个操作栏; <!--右侧的触发栏--> <div class="rightTrigger"> </div> <!--右侧的菜单控制栏--> <div id="d 阅读全文

posted @ 2022-04-24 14:25 lzhdim 阅读(9145) 评论(0) 推荐(0) 编辑

摘要:此文写的是博客顶部的动态导航菜单。 这里菜单包括两个动态效果,一个是菜单效果,一个是菜单的页面加载跳动效果。 1、 CSS样式表; https://files.cnblogs.com/files/lzhdim/webwidget.css?t=1648103673 这个菜单的样式表定义。具体只是顶部菜 阅读全文

posted @ 2022-04-23 12:06 lzhdim 阅读(9100) 评论(0) 推荐(0) 编辑

摘要:此文写的是博客顶部展示栏的水波纹效果。 这个效果也是由CSS和JS组成,实际请看博客顶部的展示栏效果。 JS脚本: https://files.cnblogs.com/files/lzhdim/jquery.ripples.min.js?t=1648030691 这个是JS脚本,放置到HTML代码里 阅读全文

posted @ 2022-04-22 10:58 lzhdim 阅读(9020) 评论(0) 推荐(0) 编辑

摘要:此文写的是博客侧边栏的时钟信息。 见下图效果: 这个时钟效果,也是有CSS样式表和JS脚本组成。 1、 CSS样式表; https://files.cnblogs.com/files/lzhdim/Clock.css 样式表里定义了时钟的字、星期等内容,在实际的使用时,需要根据自己博客的侧边栏宽度进 阅读全文

posted @ 2022-04-21 13:46 lzhdim 阅读(9078) 评论(0) 推荐(0) 编辑

摘要:此文写的是博客中的个人信息加载。 见下图效果: 上面图将个人信息加载的效果进行了展示,信息接口的见另一篇博文: https://www.cnblogs.com/lzhdim/p/16156936.html 实际中需要的信息,那根据上面博文中的接口进行操作即可。 阅读全文

posted @ 2022-04-20 12:34 lzhdim 阅读(9051) 评论(0) 推荐(0) 编辑

摘要:从此篇博文开始,将进行博客相关的操作栏等效果的内容编写。 此文写的“随鼠标移动的DIV”这个效果的内容。 1、 CSS定义; https://files.cnblogs.com/files/lzhdim/cursorMoveDiv.css?t=1648051844 上面是CSS定义文件,各个模块的C 阅读全文

posted @ 2022-04-19 14:13 lzhdim 阅读(9050) 评论(0) 推荐(0) 编辑

摘要:此文写的是博客页脚的HTML代码定制。 页脚的HTML代码,主要是操作页面加载完成时之前的一些信息。这里笔者的页脚代码,主要添加的是页面底部的版权栏等相关的信息。见下图效果: 笔者的页脚HTML定义代码,除了版权栏之外,主要是放置的页面加载完成时的Javascript代码,用以执行相关的脚本操作。 阅读全文

posted @ 2022-04-18 14:44 lzhdim 阅读(9570) 评论(0) 推荐(0) 编辑

摘要:此文写的是博客的侧边公告栏的HTML代码。 这个侧边公告栏代码,只是对侧边公告栏中的内容进行自定义。在后台的选项栏里,有相关的侧边栏的选项进行设置的。这里侧边栏的HTML代码,只是在原来的设置的侧边栏的基础上进行的添加信息的内容。见下图: 笔者对于侧边栏,从个人网站上的ASP文件中获取到信息,然后在 阅读全文

posted @ 2022-04-17 19:29 lzhdim 阅读(9551) 评论(0) 推荐(0) 编辑

摘要:此文讲的是博客页首HTML代码的定制。 页首HTML代码,主要放置的是在页面首部的HTML代码和需要的Javascript代码。笔者的页首HTML代码,放置的是页面顶部的定制菜单,以及导航栏。见下图的代码: 这里笔者把页面需要的各个模块的CSS样式表和Javascript脚本放在了页首代码栏内。因为 阅读全文

posted @ 2022-04-17 15:26 lzhdim 阅读(9190) 评论(0) 推荐(0) 编辑

摘要:博客园的个人博客,最基本的是一个初始的界面的皮肤,这个包含着自己的HTML页面代码和CSS代码,以及博客自己的基础的Javascript代码。 在这次的博客界面改造中,笔者的建议是先把博客界面的默认CSS获取出来,然后对其进行自定义修改,使其能够满足博客界面的要求,同时在修改博客界面的HTML代码基 阅读全文

posted @ 2022-04-16 17:45 lzhdim 阅读(9122) 评论(0) 推荐(0) 编辑

摘要:2022年3月中旬,在家闲来无事,看了下个人博客,萌发了对博客界面进行升级改造的念头。 在博客园也有13年之久了,刚在博客园安家的时候,已经对个人博客界面进行了改造,比如CSS样式,个人信息等。这次决定从界面设计入手,配合前端的知识经验,对博客的界面及代码进行升级改造,规范起来,同时也利于以后的升级 阅读全文

posted @ 2022-03-26 16:13 lzhdim 阅读(9110) 评论(0) 推荐(0) 编辑

Copyright © 2000-2022 Lzhdim Technology Software All Rights Reserved