jQuery
文章平均质量分 52
fengzhen8023
专于前端,不止于前端!
展开
-
jQuery案例demo -- 鼠标移入显示蒙版
效果展示:具体代码:<ul id="fourth_tab"> <li> <img src="img/camera_green.png" alt="绿色相机" class="camera"原创 2018-05-30 11:14:59 · 732 阅读 · 0 评论 -
jQuery案例demo -- 轮播图效果
效果展示:编程思路:1. 首先是基础的布局,使用"子绝父相"等页面布局方法,将图片、左右按钮以及每张图片下方对应的标识小按钮安排的明明白白。2. JS中在通过点击左右按钮来切换图片时,使用三个变量分别来表示当前显示的图片序号、点击上一张按钮时候显示的图片序号、点击下一张按钮时候显示的图片序号。3. 在自动轮播的时候,通过使用定时器来改变当前显示的图片序号来控制轮播具体...原创 2018-06-01 10:23:59 · 704 阅读 · 0 评论 -
jQuery案例demo--2048游戏
整体思路:1. 基础设置:游戏的背景是一个4*4的格子背景, 游戏中分别有2、4、8、16等不同的色块,每种色块的颜色由js脚本来控制。 2. 游戏开始: 游戏开始的时候,进行初始化操作。在4*4的格子上面,随机生成2个色块,色块的里面的数字是2或4。这里应当注意的是格子和色块不是同一个元素,即整个页面中有16个格子元素和若干个色块元素。这里要注意一下格子元素和色块元素的CSS样式布局。...原创 2018-07-17 10:54:28 · 467 阅读 · 0 评论 -
jQuery擦除插件eraser
eraser插件简介:jQuery.eraser 是一个基于 jQuery 的插件,它的效果类似于橡皮擦,按住鼠标不放,在图片上面来回移动,上面灰色的图片就会被擦出,显示出下面彩色的图片。jQuery.eraser 的原理其实是有灰色、彩色两张图片(都需要自己事前准备),将灰色的图片装载于一个 canvas 中,然后和彩色的图片用 CSS 定位在同一个位置,并设置 z-index 使 ca...原创 2018-07-05 09:44:55 · 521 阅读 · 0 评论 -
使用js操作checkbox
我们在项目中经常会遇到这个问题:使用js判断checkbox框是否被选中以及使用js对checkbox进行操作。 其实这些需求很简单,这里给出使用原生js和jQuery来完成这些需求。一.使用原生JavaScript判断是否选中checkbox框<input type="checkbox" id="test" class="test"&原创 2018-07-31 15:22:48 · 34730 阅读 · 1 评论 -
jQuery实现手风琴效果
我们在项目总经常会遇到制作手风琴效果的需求。其实实现手风琴效果不难,特别是使用jQuery来实现,就更加简单了。这里给大家分享两个手风琴效果的制作方法。一、横向手风琴图片切换效果最终的效果图:备注: 为了方便大家清晰明地阅读代码,我将一些不必要的部分去掉了,也就是每张图片下方的导航文字去掉了。想要源代码的同学可在文末获取,整个DEMO的源码在文末有下载链接。...原创 2018-08-07 14:35:43 · 20505 阅读 · 5 评论 -
jQuery语法——创建节点、插入节点、删除元素
一、创建节点在使用JQuery的时候,我们有多种方式来创建新节点,使用不同方式创建的新节点都可以采用相同的方法插入到HTML页面中。1.使用HTML标签创建节点var node_1 = "<li>这是创建的第一个节点</li>"2.使用jQuery创建节点var node_2 = $("<li></li>").text...原创 2018-09-25 12:44:21 · 438 阅读 · 0 评论