![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
jQuery
小哦--
努力努力再努力
展开
-
正则表达式(表单验证)
原创 2019-09-04 17:06:10 · 69 阅读 · 0 评论 -
bootstrap栅格系统
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, ...原创 2019-09-03 18:55:10 · 81 阅读 · 0 评论 -
bootstrap前端开发框架、bootstrap容器
首先下载,下载下来,包括三个部分:一个fonts文件夹一个css文件 + 一个js文件bootstrap 应用:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <!-- meta:vp tab键 --> ...原创 2019-09-03 18:45:39 · 171 阅读 · 0 评论 -
swiper参数设置
这里是一一对应的。原创 2019-09-03 18:29:22 · 493 阅读 · 0 评论 -
移动端js事件和库(zepto库、swiper.js插件)
使用swiper 做幻灯片切换,代码太长,只写swiper段:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, init...原创 2019-09-03 18:21:24 · 517 阅读 · 0 评论 -
本地存储--弹框案例
只提示一次的弹框:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.j...原创 2019-09-03 18:04:35 · 156 阅读 · 0 评论 -
jQuery UI--制作滚动条
拖拽滑动条:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>drag</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"><...原创 2019-09-03 17:18:46 · 247 阅读 · 0 评论 -
json 数据格式、ajax与jsonp
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"&g...原创 2019-09-03 16:55:10 · 56 阅读 · 0 评论 -
配置服务器环境
看了好多别人的,需要各种配置环境变量之类的 ,但是我不知道为啥,我自己的好方便,是不是版本问题。其实不太确定,但是后续的使用一切正常。目前还不知道原因,还是记录一下自己的配置过程。(现在想一下,是不是因为我下载了most users版本。)首先从官网上下载https://nodejs.org/en/我下载的第一个。下载完之后,我双击,就安装完了,接下来别人的环境变量配置我没有做,就进行测...原创 2019-09-03 15:44:39 · 106 阅读 · 0 评论 -
栅格响应式布局
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, m...原创 2019-09-03 19:05:45 · 308 阅读 · 0 评论 -
栅格偏移
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, ...原创 2019-09-03 19:19:00 · 425 阅读 · 0 评论 -
前端性能优化
原创 2019-09-04 16:36:00 · 70 阅读 · 0 评论 -
栅格里面的row
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, m...原创 2019-09-04 15:37:00 · 402 阅读 · 0 评论 -
bootstrap图片、字体图标、巨幕、导航条
导航条:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale...原创 2019-09-04 13:14:15 · 510 阅读 · 0 评论 -
bootstrap路径导航、下拉菜单
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0,...原创 2019-09-04 13:13:57 · 748 阅读 · 0 评论 -
bootstrap 模态框
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, ...原创 2019-09-03 19:51:23 · 92 阅读 · 0 评论 -
bootstrap 表单
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, ...原创 2019-09-03 19:48:14 · 104 阅读 · 0 评论 -
bootstrap 按钮
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, ...原创 2019-09-03 19:25:27 · 85 阅读 · 0 评论 -
栅格隐藏
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, ...原创 2019-09-03 19:21:04 · 500 阅读 · 0 评论 -
整屏滚动
css文件夹下:test.cssbody,ul{ margin:0; padding:0;}ul{list-style:none;}.pages_con{ position:fixed; left:0; top:0; width:100%; overflow:hidden;}.pages{ height:600px; position:relative;}...原创 2019-09-03 13:01:02 · 348 阅读 · 0 评论 -
js 制作css3 动画
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></sc...原创 2019-09-03 10:29:02 · 107 阅读 · 0 评论 -
鼠标滚轮事件+滚轮事件插件jquery.mousewheel
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></s...原创 2019-09-03 10:23:39 · 353 阅读 · 0 评论 -
获取可视区尺寸、获取滚动距离
获取可视区尺寸<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"&g...原创 2019-09-02 13:34:16 · 326 阅读 · 0 评论 -
获取元素尺寸、获取元素绝对位置
获取元素尺寸<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js">...原创 2019-09-02 13:19:37 · 238 阅读 · 0 评论 -
链式调用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>层级菜单</title> <style type="text/css"> body{ font-family:'Microsoft Yahei'; ...原创 2019-09-02 11:22:11 · 198 阅读 · 0 评论 -
animate动画
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></s...原创 2019-09-02 11:05:20 · 5028 阅读 · 0 评论 -
特殊效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> .box{ width:300px; height:300px;...原创 2019-09-02 10:47:49 · 102 阅读 · 0 评论 -
绑定click事件、获取元素索引值
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></s...原创 2019-09-02 10:32:27 · 1297 阅读 · 0 评论 -
样式操作
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></s...原创 2019-09-02 10:00:28 · 97 阅读 · 0 评论 -
选择器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></...原创 2019-09-02 09:33:22 · 79 阅读 · 0 评论 -
属性操作
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></...原创 2019-09-02 14:26:03 · 100 阅读 · 0 评论 -
循环
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></s...原创 2019-09-02 14:37:00 · 96 阅读 · 0 评论 -
节点操作练习题--计划表
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>todolist</title> <style type="text/css"> .list_con{ width:600px; margin:50px ...原创 2019-09-03 10:10:30 · 176 阅读 · 0 评论 -
a 链接的herf属性
当链接处于网页下拉底部时,点击链接 ,会默认回到网页顶部。但是如果我们不写herf属性,就会失去链接的特效,这也不是我们想要的。我们既想保持住链接特效,也不想回到网页顶部。处理方法如下所示:...原创 2019-09-03 09:27:25 · 404 阅读 · 0 评论 -
已有元素节点操作
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></s...原创 2019-09-03 08:56:40 · 77 阅读 · 0 评论 -
新建元素节点操作
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></s...原创 2019-09-03 08:46:26 · 142 阅读 · 0 评论 -
事件委托
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> .list{ background-color:gold; li...原创 2019-09-03 08:35:54 · 65 阅读 · 0 评论 -
事件冒泡、阻止事件冒泡
事件冒泡:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js">...原创 2019-09-03 08:18:17 · 172 阅读 · 0 评论 -
绑定事件的其他方法、解绑
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></...原创 2019-09-02 15:40:24 · 98 阅读 · 0 评论 -
jQuery事件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="js/jquery-1.12.4.min.js"></s...原创 2019-09-02 15:31:28 · 79 阅读 · 0 评论