【JQ实战一之烟花】的更多相关文章

JQ实战一之烟花

本次的效果大概为当用户点击网页时,网页下方弹出一个类似烟花的长条条,然后在桌面上散开以达成类似烟花的特效.话不多说先上图. 首先布局,布局很简单 <style> body { background:#000; overflow:hidden;} </style> 接着js部分,主要以JQ为主 <body> <script type="text/javascript" src="js/jquery-1.10.2.min.js"…

jq实战-表单验证

作为学习的记录,方便大家查看,废话不多说,直接上代码 html 结构: <form action="a.php" method="" class="form"> <div> <label for="username">用户名:</label> <input id="username" class="required" type=&qu…

JQ实战天猫淘宝放大镜

这个特效平时生活中很常见,话不多说先上效果图. 首先布局,遮罩层是这个效果中的重点精华,也就是下面代码中的shade. <style> * { margin:0px; padding:0px;} #box { width:400px; height:400px; border:5px solid #CCC; margin:100px auto; position:relative;} #box .simg {width:400px; height:400px; position:relativ…

jQuery精华

第一章:入门 选择元素: $() css() $("li").css():可以省略原生的循环操作 $ == jQuery jQuery方法函数化: click() html() JS与jQ关系: 可以共存,不能混写 函数中this是原生的,$(this)转换为jQ对象 点击变色例子: <!DOCTYPE html> <html> <head> <title></title> <style> div{ width:…

JS系列：js节点

节点(node) 在html文档中出现的所有东西都是节点 元素节点(HTML标签) 文本节点(文字内容) 注释节点(注释内容) 文档节点(document) … 每一种类型的节点都会有一些属性区分自己的特征与特性 nodeType: 节点类型 nodeName:节点名称 nodeValue:节点值 元素节点nodeType:1nodeName:”DIV” //大写的标签名nodeValue:null //节点值 文本节点nodeType:3nodeName:‘text’nodeValue:文本内…

接口测试 Mock 实战(二) | 结合 jq 完成批量化的手工 Mock

因为本章的内容是使用jq工具配合完成,因此在开始部分会先花一定的篇幅介绍jq机器使用,如果读者已经熟悉jq,可以直接跳过这部分.先来看应用场景,App 经常会有一些信息展示的列表页,比如商家的菜品.股票的公司.文章的列表展示等,例如下面这样:菜品不够吃的话~不是,是菜品数量较少不够测试的量,假如我们想要测试几百个菜品时,会不会在刷的时候是否有性能影响,展示是否正常,列表展示的边界值测试等:而要测就得有数据展示,这个时候要是通过后端去找或者造这么多数据是有点麻烦的,其实我们这个测试的测试点就是要测…

接口测试 Mock 实战 | 结合 jq 完成批量化的手工 Mock

本文霍格沃兹测试学院学员学习实践笔记. 一.应用背景 因为本章的内容是使用jq工具配合完成,因此在开始部分会先花一定的篇幅介绍jq机器使用,如果读者已经熟悉jq,可以直接跳过这部分. 先来看应用场景,App 经常会有一些信息展示的列表页,比如商家的菜品.股票的公司.文章的列表展示等,例如下面这样: 菜品不够吃的话~不是,是菜品数量较少不够测试的量,假如我们想要测试几百个菜品时,会不会在刷的时候是否有性能影响,展示是否正常,列表展示的边界值测试等: 而要测就得有数据展示,这个时候要是通过后端去找或…

Web 前端实战：JQ 实现树形控件

前言 这是一篇个人练习 Web 前端各种常见的控件.组件的实战系列文章.本篇文章将介绍个人通过 JQuery + 无序列表 + CSS 动画完成一个简易的树形控件. 最终实现的效果是: 这样结构比较复杂的嵌套再嵌套的 HTML 结构必须先写一个静态的观察,不可能一步到位,事情是逐渐发展的.遵循自顶向下.逐步求精.模块化三个原则. 静态实现 HTML 点击查看 HTML 代码 <ul class="category"> <li class="category-…

Web 前端实战：JQ 实现下拉菜单

实现过程 实现一个简易的鼠标悬停菜单项显示其子项的下拉框控件.将用到 CSS 绝对定位.流式布局.动画等:JQuery 鼠标移入和移出事件.DOM 查找.效果图如下: HTML 结构: <div class="dropdown-group"> <div class="dropdown"> <div class="label">菜单1</div> <div class="items&q…

emmet,jade,haml, slim,less,sass,coffeescript等的实战优缺点

摘要: 文章背景,来自于群内周五晚上的一次头脑风暴式的思维碰撞交流活动. 随着前端技术的蓬勃发展, 各种新技术随着生产力的需要不断的涌入我们的视野, 那今天探讨的话题是这些新时代的前端兵器谱: 一. html : Emmet,jade,haml,slim http://www.ruanyifeng.com/blog/2013/06/emmet_and_haml.html 二. css : less,sass,stylus http://www.zhihu.com/question/2030038…