08 2019 档案

摘要:项目应用-布局钟表支架和页面图片 在前面实现两种时钟的效果,将前面用到的知识整合于一小项目中 用到的素材: 由于这张截取的素材太大,我就不放在该位置了 项目页面初始布局效果: 初始布局代码: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="U 阅读全文
posted @ 2019-08-31 17:17 perfect* 阅读(359) 评论(0) 推荐(0) 编辑
摘要:数码管时钟-根据当前时间变化秒钟 在上一篇博文中实现了数码管时钟的布局,接下来我们就让数码管时钟动起来吧!在该篇博文中录的gif图像有点差强人意,望见谅。 项目文件: 实现根据当前时间变化秒钟的效果: 实现该效果的js代码: 其中: 注意: 数码管时钟-根据当前时间变化小时和分钟的图片 实现方式和秒 阅读全文
posted @ 2019-08-31 15:39 perfect* 阅读(585) 评论(0) 推荐(0) 编辑
摘要:在上几篇博文中介绍了基于js和jQuery实现了表盘时钟,接下来将去实现数码管时钟 数码管时钟-创建工程-基本布局 实现数码管用到的素材: 链接:https://pan.baidu.com/s/1kfb_YskyDzpuRxEtbOWsyg 提取码:e233 创建工程:ClockLed.html 布 阅读全文
posted @ 2019-08-31 10:49 perfect* 阅读(405) 评论(0) 推荐(0) 编辑
摘要:在上一篇博文中使用了js实现了时钟的案例,在这篇博文中将介绍使用JqueryRotate插件简化时钟代码以及为时钟进行添加声音 使用JqueryRotate插件简化时钟 插件jqueryrotate优点 它可以实现旋转效果。jqueryrotate 支持所有主流浏览器,甚至包括 IE6,所以在兼容方 阅读全文
posted @ 2019-08-30 23:51 perfect* 阅读(769) 评论(0) 推荐(0) 编辑
摘要:在上一篇博文中实现了秒针的转动,接下来需要进行实现分针的布局和旋转角度计算和时针的布局和旋转角度计算 时钟案例-分针的布局和旋转角度计算 实现的效果图: 实现该效果的css代码与HTML代码: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset=" 阅读全文
posted @ 2019-08-30 22:29 perfect* 阅读(489) 评论(0) 推荐(0) 编辑
摘要:时钟案例-显示表盘 需要使用到的素材: 显示表盘的最终效果: 使用到的css: 使用到的HTML: 其中: 表示铺满整个div 时钟案例-秒针的布局 需要按f12细微的调节其位置,记得复制调整好的位置哦! 最终实现的效果: 实现该效果的css以及HTML: 时钟案例-秒针调整旋转原点-编写定时器秒针 阅读全文
posted @ 2019-08-30 17:47 perfect* 阅读(544) 评论(0) 推荐(0) 编辑
摘要:CSS实现网页元素的旋转 方式一:css方式 针对一个DOM,使用css并不能让其一直循环旋转,css只能使其旋转一定的角度: 因此使用js的代码实现一直旋转: 使用的js的代码如下,通过使用一个变量,每一秒转动10度: html 其中:使用了启动定时函数,第一个参数为调用的函数,第二个参数为间隔的 阅读全文
posted @ 2019-08-30 11:14 perfect* 阅读(748) 评论(0) 推荐(0) 编辑
摘要:前台页面数据通过连接数据库信息将数数据显示在页面上: 最终实现的效果: 前台的路由: 前台的首页: 1 <!doctype html> 2 <html lang="zh-CN"> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="renderer" co 阅读全文
posted @ 2019-08-29 11:02 perfect* 阅读(796) 评论(0) 推荐(0) 编辑
摘要:登录后台 需要监听用户的访问地址,只有管理员才能登录后台 在后台的路由admin.js: 登录页面: 进行处理登录的操作: 登录的效果如下: 退出后台登录: 当点击 在后台路由中写入 最终实现的效果图: 整个后台的路由: 1 //导入express 2 3 let express=require(" 阅读全文
posted @ 2019-08-29 10:45 perfect* 阅读(1265) 评论(0) 推荐(0) 编辑
摘要:查看功能: 在视图views中新建文件夹comment用来存放评论管理的页面: 当点击侧边栏的评论管理,因此需要路由的跳转,在后台路由中新建comment.js用来实现评论管理所需要的路由: 在使用该路由之前需要对该路由进行注册: 在评论管理的路由中进行书写加载页面的代码,并展示相关数据: 其展示出 阅读全文
posted @ 2019-08-29 10:18 perfect* 阅读(753) 评论(0) 推荐(0) 编辑
摘要:添加页面:(add.html) 在视图views中新建文件夹news,新建index.html,add.html,edit.html,首先进行add.html页面的书写 add.html的页面显示: 将该页面进行在后台新闻路由中进行加载,首先得在后台路由中去进行注册; 在后台路由中进行添加页面的加载 阅读全文
posted @ 2019-08-29 09:36 perfect* 阅读(749) 评论(0) 推荐(1) 编辑
摘要:作用: 圣杯布局和双飞翼布局解决的问题是相同的,就是两边顶宽,中间自适应的三栏布局,中间栏要在放在文档流前面以优先渲染。 区别: 圣杯布局:为了让中间div内容不被遮挡,将中间div设置了左右padding-left和padding-right后,将左右两个div用相对布局position: rel 阅读全文
posted @ 2019-08-28 17:23 perfect* 阅读(12631) 评论(1) 推荐(2) 编辑
摘要:在新闻管理中分为新闻分类管理、新闻管理、评论管理 分析新闻分类管理: 新闻分类数据库的字段: 对新闻分类有修改、删除、查看功能 在该后台的首页新闻管理部分写入跳转的路由: 在后台路由中进行注册新闻分类路由: 在视图views中新建文件交type,写入加载的页面: newtype.js中分别写入加载的 阅读全文
posted @ 2019-08-28 12:45 perfect* 阅读(493) 评论(0) 推荐(0) 编辑
摘要:系统设置在侧边栏的系统管理中: 在视图views的后台index.html中对应的系统设置写入跳转的路由: 在后台路由中进行注册该路由system.js 在视图views中新建文件夹system,加入页面index.html 1 <!DOCTYPE html> 2 <html lang="zh-cn 阅读全文
posted @ 2019-08-28 12:25 perfect* 阅读(356) 评论(0) 推荐(0) 编辑
摘要:轮播图管理添加功能 后台轮播图管理的位置: 因此需在此处加一个路由的跳转: 在视图views中后台的index.html 在后台路由中新建一个slider.js 在整个后台中进行对轮播图路由的注册: 在后台的视图views中新建文件夹slider,并加入: 需要实现轮播图的添加功能,在slider. 阅读全文
posted @ 2019-08-28 12:04 perfect* 阅读(1573) 评论(0) 推荐(0) 编辑
摘要:在上一篇实现了管理员的功能,在这篇博文中将实现会员的功能 准备工作: 在视图views中新建一个user的文件夹 将视图views文件夹中的index.html的侧边导航栏中的会员管理的连接到/admin/user路由; 在routers文件夹的admin中有user.js的路由: 需要在里面进行加 阅读全文
posted @ 2019-08-17 10:09 perfect* 阅读(441) 评论(0) 推荐(0) 编辑
摘要:删除功能 管理员首页删除部分的代码: 使用到的js: 控制台出现的错误: GET http://localhost:3000/admin/admin/ajax_del?id=2 404 (Not Found) 错误的原因:由于没有写ajax_del的路由。 当在admin.js把ajax_del的路 阅读全文
posted @ 2019-08-14 21:02 perfect* 阅读(518) 评论(0) 推荐(0) 编辑
摘要:管理员展示功能 书写sql语句看是否能查询出数据库的数据 由图中可以看出查询并打印出数据库的数据 使用ejs的模板引擎,进行对数组的遍历: 使用: 将上述代码该为从数据库获取的数据,将数据展示于页面上: 从显示的效果来看,可以看出时间并没有显示正确,需要对时间进行一下格式化: 在npm 中提供了一种 阅读全文
posted @ 2019-08-14 17:39 perfect* 阅读(421) 评论(1) 推荐(0) 编辑
摘要:管理员管理添加功能(一) 在点击管理员管理中的添加管理,出现的是一段文字需要进行修改为显示一个页面 在views视图层admin中新建admin文件夹: 经过修改后页面的显示: 但是显示的页面并没有样式,需要进行修改: 修改后的效果: 管理员管理代码index.html: 1 <!DOCTYPE h 阅读全文
posted @ 2019-08-12 11:29 perfect* 阅读(697) 评论(0) 推荐(0) 编辑
摘要:在浏览器中的启动效果: 出现该效果的原因,由于代码中没有配置路由: 出现该效果的代码: 1 //导入express框架 2 let express=require('express'); 3 4 //初始化express 5 let app=express(); 6 7 //监听服务 器 8 app 阅读全文
posted @ 2019-08-11 10:01 perfect* 阅读(485) 评论(0) 推荐(0) 编辑
摘要:项目概述: 本项目主要使用Node.js+express框架+mysql数据库完成博客系统开发 项目需求: 项目分析: 1)前台功能分析 栏目列表 轮播图展示 最新发布 热门文章 搜索功能 分类新闻 热门文章 新闻详情 相关推荐 热门文章 评论列表 评论发布 2)后台功能分析 项目数据库分析 (1) 阅读全文
posted @ 2019-08-08 22:40 perfect* 阅读(637) 评论(0) 推荐(0) 编辑
摘要:分析用户的注册以及使用的技术: 使用thymeleaf代替jsp进行提交表单,进行书写user的实体,并且到数据库中进行添加user对象,使用spring Data JPA与jpa进行整合,需要使用CrudRepository接口 使用Thymeleaf修改html页面 导入Thymeleaf: 需 阅读全文
posted @ 2019-08-02 17:02 perfect* 阅读(1148) 评论(0) 推荐(0) 编辑
摘要:以用户登录为例: 创建项目:https://start.spring.io/ 用到的五个技术: 将所得到的文件夹内容解压,可以看到自己添加的技术: 使用指令在命令窗口进行编译,编译过程有点慢,请耐心等待: 导入项目: 点击next即可, 点击finish即可,导入的过程也比较慢,请耐心等待 导入成功 阅读全文
posted @ 2019-08-02 15:12 perfect* 阅读(216) 评论(0) 推荐(0) 编辑

$(function() { $('#cnblogs_post_body img').each(function() { let imgSrc = $(this).attr('src'); let year = parseInt(imgSrc.substr(imgSrc.indexOf('g')+1,4)); if(year >= 2022){ imgSrc += `?watermark/2/text/amlndWl5YW4=/font/5a6L5L2T/fontsize/15/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast`; $(this).attr('src', imgSrc) } }) })
点击右上角即可分享
微信分享提示