前后端相关学习
关注
分享
扫一扫
文章平均质量分 60
涉及前端后端之间的知识
Flynn_curry
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
AJAX、XML和JSON的学习笔记
AJAX用于连接前后端实时交互，而XML和JSON都是传输数据的格式。AJAX相关：1、AJAX即异步的 JavaScript 和 XML，在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。2、作用简单来说我认为就是连接前后端实现实时交互功能（javascript是实现网页中的动态元素，但他自己就可以动，未包含实时元素）。3、实例如：google suggestion、下拉框点击自动输出信息。4、标准实例代码如下：click hereXML相关：1、X..原创 2021-01-16 12:17:25 · 301 阅读 · 0 评论 -
网站前端实例之一
很久以前写的一个前端，前些日子换电脑差点丢了，寻思着放着也没什么卵用，不如贴出来吧。效果展示图：原创 2020-02-21 10:04:02 · 1624 阅读 · 1 评论 -
Bootstrap4学习笔记+练习
1、导航栏内容居右：ml-auto；导航栏内容居左：mr-auto；附上未完成的练习。。<!DOCTYPE html><html><head> <title>监控公司</title> <meta charset="utf-8"> <link rel="stylesheet...原创 2019-06-22 17:46:28 · 639 阅读 · 0 评论 -
原生js实现可切换式导航栏
前些日子看到个这样的效果：于是就想实现一下，思路是通过js实现多个div的是否显示，也就是display:none;来控制内容的切换，我的效果如下：由于切换的是div，所以里面的内容不会影响整体功能。下面上代码。html：<!DOCTYPE html><html><head> <title>新浪式点击切换导航&l...原创 2019-06-08 18:38:33 · 8672 阅读 · 2 评论 -
Swiper实现两种常用轮播图
效果图：市面上实现的网页中的轮播图大多都是用Swiper实现的，主要就是这两种，其实没必要写这篇的，写这篇的目的.....emmm.....方便以后伸手使用和练习两个swiper......别打我。。html：<!DOCTYPE html><html><head> <title>实用轮播图</title> <...原创 2019-05-15 15:43:56 · 9638 阅读 · 6 评论 -
Swiper制作滑动型产品展示图
效果图：前些日子见到了这种效果图，本来想着用js敲可是估计又要废掉大半天，再加上时间紧而且没必要，就看了看现成的轮子。然而网上的轮子貌似都是jquery插件，无奈，突然想起Swiper貌似也能做，于是就弄出来了这些东西。Swiper插件非常强大，真心佩服。由于通常网页中至少一个轮播图，所以这里会遇到如何如何在网页中插入两个Swiper且不产生冲突，解决方法在这里：click here~...原创 2019-05-15 14:46:14 · 1072 阅读 · 0 评论 -
原生js实现自定义右键菜单进行颜色切换
简单来说就是js中用了个2重闭包，至于菜单，和导航栏的下拉框一样，不用时隐藏，使用时显示。直接上代码了，比较简单。效果图：html:<!DOCTYPE html><html><head> <title>practice</title> <meta charset="utf-8"> <...原创 2019-04-20 16:30:15 · 884 阅读 · 0 评论 -
input和textarea中字体样式不同的解决方法
当我们写一个输入框群组时，input和textarea中字体样式会不同，比如下面：里面输入的字也不一样：代码在这里：html：<div style="margin: 0 auto; width: 800px; height: 800px;"> <input type="text" name="email" class="info-inpu...原创 2019-04-26 17:50:15 · 11683 阅读 · 0 评论 -
小程序学习笔记
1、小程序中的text是块级元素，和html5中的p相比，区别是p中不能识别空格和换行，text可以识别空格和换行。原创 2019-04-08 09:38:26 · 417 阅读 · 0 评论 -
原生js实现点名器
效果图：直接上代码，太简单了：html：<!DOCTYPE html><html><head> <title>漫威点名器</title> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="test9.css"...原创 2019-03-23 09:09:51 · 2442 阅读 · 0 评论 -
原生js实现多功能可滑动轮播图
效果图：这次做的轮播图，值得注意的主要功能有：1、滑动动画切换效果(无缝衔接)；2、标签和略缩图点击切换效果(自适应性滑动，不同距离滑动速度不同)；3、自动循环播放；4、鼠标悬浮在轮播图上时停止自动播放。难点：1、循环滑块动画切换效果，主要的算法也集中在这里。我的方法是前后多放一张图，然后在切换结束后的一刻瞬间改变参数，这样就不会有一闪而过同时还能无缝衔接的效果；...原创 2019-03-21 18:29:15 · 1436 阅读 · 0 评论 -
js学习笔记
1、匿名自执行函数： 首先匿名自执行函数属于闭包，闭包的主要作用就是使函数拥有私有变量成为可能。那么匿名自执行函数作为一个容器，内部可以访问外部变量，而外部不能访问外内部变量。 其次，匿名说明本函数声明无特殊意义，只是为了划分闭包。 最后，自执行相当于声明多个函数，但不调用，当因为某些动态事件(比如鼠标点击)触发该函数时才执行，因为是由实时时间触发执行，所...原创 2019-03-20 09:29:47 · 274 阅读 · 0 评论 -
我的第一个html页面
写了三遍，终于写成了，感动。。。。。静态页面，主要难在布局，布局效果需要使所有设备都兼容。iphone5和ipadpro...一言难尽。。不过总算真正写好了。只用了浮动，然后，栅格化(我自己发明的，就是说分了很多底块)程度很大，为了防止不同设备跑偏。我实现的是这个页面。接下来贴上源码：HTML:<!DOCTYPE html><ht...原创 2019-03-02 16:21:56 · 1083 阅读 · 0 评论 -
CSS学习笔记
1、垂直居中：line-height==行高。2、img是行元素，行元素有自带的下边距，如果遇到这种情况下的间隙，解决方法是display：block。3、使用padding-top or bottem出现改变行高的现象，处理方法：box-sizing: border-box;制作边界盒。4、垂直居中：对应于float布局：transform:translate(0,...原创 2019-02-28 10:04:04 · 322 阅读 · 0 评论