jquery动画

网上面试题

落花浮王杯 提交于 2019-12-09 07:10:33
链接:https://www.zhihu.com/question/41466747/answer/91084888 1.对WEB标准以及W3C的理解与认识 标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外 链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件,容易维 护、改版方便,不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性; 2.xhtml和html有什么区别 HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言 最主要的不同: XHTML 元素必须被正确地嵌套。 XHTML 元素必须被关闭。 标签名必须用小写字母。 XHTML 文档必须拥有根元素。 3.Doctype? 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义? 用于声明文档使用那种规范(html/Xhtml)一般为 严格 过度 基于框架的html文档 加入XMl声明可触发,解析方式更改为IE5.5 拥有IE5.5的bug 4.行内元素有哪些?块级元素有哪些?CSS的盒模型? 块级元素:div p h1 h2 h3 h4 form ul 行内元素: a b br i span input select Css盒模型:内容,border ,margin,padding 5

Jquery绑定事件及动画效果

ぃ、小莉子 提交于 2019-12-08 17:47:28
Jquery绑定事件及动画效果 本文转载于: https://blog.csdn.net/Day_and_Night_2017/article/details/85799522 绑定事件 bind(type,data,fuc) one(type,data,fuc) //只执行一次 常见事件类型 名称 含义 blur 失去焦点 focus 获取焦点 load 加载 resize 重置大小 scroll 滚动 unload 卸载 click 点击 dblclick 双击 mousedown 鼠标按下 mouseup 鼠标弹起 mousemove 鼠标移动 mouseover 鼠标悬停 mouseout 鼠标移走 mouseenter 鼠标移入 mouseleave 鼠标离开 change 内容改变 select 选中 submit 提交 keydown 有键按下 keypress 有键按下 keyup 有键弹起 error 有错误 判断是否显示 if($("#id").is(":visible")) { } else { } 简化绑定事件 $(this).mouseover(function(){ //代码 }) Hover事件 hover(enter,leave) 光标移入,触发第一个事件,光标移走,触发第二个事件 $("#id").hover(function(){ //光标移入

Zepto 使用中的一些注意点

旧巷老猫 提交于 2019-12-07 20:28:23
前段时间完成了公司一个产品的 HTML5 触屏版,开发中使用了 Zepto 这个著名的 DOM 操作库。 为什么不是 jQuery 呢?因为 jQuery 的目标是兼容所有主流浏览器,这就意味着它的大量代码对移动端的浏览器是无用或者低效的。 而 Zepto 只针对移动端浏览器编写,因此体积更小、效率更高,更重要的是,它的 API 完全仿照 jQuery ,所以学习成本也很低。 但是在开发过程中,我发现 Zepto 还远未成熟,其中包含了一些或大或小的“坑”,与 jQuery 的差距还是很明显的,所以写篇文章记录下,希望对后来者有帮助 注意,本文撰写时 Zepto 版本为 1.0 正式版 从哪里下载 Zepto 这个问题看起来很蠢,从官网下载不就行了嘛!可是你有没有发现下载链接上面有行小字呢? There are more modules; a list of all modules is available in the README. 在这个 README 里面你会惊奇地发现,Zepto 源码中有 14 个模块,而官网提供的标准版里面只有 7 个模块!而且居然不包含对移动端开发非常重要的 touch 模块(提供对触摸事件的支持)! 所以我的建议是,不要从官网下载,而是从 Github 下载了源代码之后自己 Build 一个版本,这样你可以自行挑选适合的模块

Zepto 使用中的一些注意点(转)

白昼怎懂夜的黑 提交于 2019-12-07 10:48:09
前段时间完成了公司一个产品的 HTML5 触屏版,开发中使用了 Zepto 这个著名的 DOM 操作库。 为什么不是 jQuery 呢?因为 jQuery 的目标是兼容所有主流浏览器,这就意味着它的大量代码对移动端的浏览器是无用或者低效的。 而 Zepto 只针对移动端浏览器编写,因此体积更小、效率更高,更重要的是,它的 API 完全仿照 jQuery ,所以学习成本也很低。 但是在开发过程中,我发现 Zepto 还远未成熟,其中包含了一些或大或小的“坑”,与 jQuery 的差距还是很明显的,所以写篇文章记录下,希望对后来者有帮助 注意,本文撰写时 Zepto 版本为 1.0 正式版 从哪里下载 Zepto 这个问题看起来很蠢,从官网下载不就行了嘛!可是你有没有发现下载链接上面有行小字呢? There are more modules; a list of all modules is available in the README. 在这个 README 里面你会惊奇地发现,Zepto 源码中有 14 个模块,而官网提供的标准版里面只有 7 个模块!而且居然不包含对移动端开发非常重要的 touch 模块(提供对触摸事件的支持)! 所以我的建议是,不要从官网下载,而是从 Github 下载了源代码之后自己 Build 一个版本,这样你可以自行挑选适合的模块

jquery样式操作,属性操作,绑定click事件,特殊效果:(二)

丶灬走出姿态 提交于 2019-12-07 01:54:21
这篇续着上篇的写吧。 4:jquery样式操作 5:jquery属性操作 6:绑定click事件 7:jquery特殊效果 8:jquery链式调用 9:jquery动画 10:尺寸相关、滚动事件 11:jquery事件 12:主动触发与自定义事件 13:事件委托 14:事件冒泡 15:jquery元素节点操作 16:滚轮事件与函数节流 17:json 18:ajax与jsonp 19:本地储存 20:jqueryUI 目录四 jquery样式操作 jquery用法思想二 同一个函数完成取值和赋值 操作行间样式 // 获取div的样式 $( "div" ).css( "width" ); $( "div" ).css( "color" ); //设置div的样式 $( "div" ).css( "width" , "30px" ); $( "div" ).css( "height" , "30px" ); $( "div" ).css({fontSize: "30px" , color : "red" }); 特别注意 选择器获取的多个元素,获取信息获取的是第一个,比如:$(“div”).css(“width”),获取的是第一个div的width。 操作样式类名 $( "#div1" ).addClass( "divClass2" ) /

jquery动画

China☆狼群 提交于 2019-12-07 00:10:47
英雄难过棍子关小游戏可以带大家熟悉jquery动画 看源码 index.js: $(function(){ var newNode=$("<div class='shadow'></div><div class='dialog'><p>游戏说明:<br /> 1、该游戏为一款好玩的闯关挑战类游戏,可以锻炼玩家的判断力,提高玩家的敏捷思维能力。<br /> 2、可以选择闯关模式或者挑战模式开始游戏。进入闯关模式后点击上方按钮可选择已解锁的关卡。<br /> 3、闯关模式总共有十个关卡,每通过一个关卡,游戏难度会逐渐增大。如果玩家玩通关闯关模式,会获得W币奖励。 <br /> 4、挑战模式会计算积分,玩家可以在线存档,也可以提交自己的积分来查看自己的排行。<br /> 5、本游戏引入了金币机制,即W币,初始金币为3个,玩家可以通过每日签到(+1 W币,连续签到从第二天起+2 W币)和完成每日的挑战任务(随机+7或8或9W币)或玩通关闯关模式(随机+10或11或12 W币)来获得W币,W币可以用来购买道具。本游戏目前含有四种道具,分别是原地复活道具、水波特效道具、蝴蝶跟随鼠标特效道具和下雪特效道具。原地复活道具只可以在挑战模式使用,其它三种道具均为特效道具,每次购买后有七天使用期限,七天后需再次购买才可继续使用。</p><button class='back1'>返回</button><

高效的jQuery代码编写技巧总结

非 Y 不嫁゛ 提交于 2019-12-06 17:38:58
最近写了很多的js,虽然效果都实现了,但是总感觉自己写的js在性能上还能有很大的提升。本文我计划总结一些网上找的和我本人的一些建议,来提升你的jQuery和javascript代码。好的代码会带来速度的提升。快速渲染和响应意味着更好的用户体验。谨以此文来提醒自己。 其次在脑子里牢牢记住jQuery就是javascript。这意味着我们应该采取相同的编码惯例,风格指南和最佳实践。 当你准备使用jQuery,我强烈建议你遵循下面这些指南: 缓存变量 DOM遍历是昂贵的,所以尽量将会重用的元素缓存。 // 糟糕 h = $('#element').height(); $('#element').css('height',h-20); // 建议 $element = $('#element'); h = $element.height(); $element.css('height',h-20); 避免全局变量 jQuery与javascript一样,一般来说,最好确保你的变量在函数作用域内。 // 糟糕 $element = $('#element'); h = $element.height(); $element.css('height',h-20); // 建议 var $element = $('#element'); var h = $element.height();

02 jQuery中的事件与动画

江枫思渺然 提交于 2019-12-06 05:34:46
jQuery中的事件 在JavaScript中,常用的基础事件有鼠标事件、键盘事件、window事件、表单事件、事件绑定和处理函数的语法格式如下 语法    事件名 = "函数名()"; 或者 DOM对象.事件名 = 函数; 1、载入事件 $(function () {}); //推荐使用 $(document).ready(function () {}); //推荐使用 window.onload = function () {} 2、鼠标事件 click()        触发将函数绑定到指定元素的click事件      鼠标单击时 mouseover()     触发将函数绑定到指定元素的mouseover事件   鼠标指针移过时     mouseout()     触发将函数绑定到指定元素的mouseout事件    鼠标指针移出时 mouseenter()    触发将函数绑定到指定元素的mouseenter事件   鼠标指针进入时 mouseleave()   触发将函数绑定到指定元素的mouseleave事件   鼠标指针离开时 mouseover() 和 mouseenter()的区别:mouseover()包含子元素绑定,而mouseenter不包含子元素绑定 3、键盘事件 keydown()    触发或将函数绑定到指定元素的keydown事件  键盘按下时

JQuery 淡出、 动画、显示/隐藏切换等效果

冷暖自知 提交于 2019-12-06 03:58:11
1、jQuery slideToggle() 表示简单的 slide panel 效果。 < html > < head > < script type="text/javascript" src="jquery-1.7.1.min.js"></ script > < script type="text/javascript"> $(document).ready(function(){ $(".flip").click(function(){ $(".panel").slideToggle("slow"); }); }); </ script > < style type="text/css"> div.panel,p.flip { margin:0px; padding:5px; text-align:center; background:#e5eecc; border:solid 1px #c3c3c3; } div.panel { height:70px; display:none; } </ style > </ head > < body > < p class="flip">请点击这里</ p > < br /> < br /> < div class="panel" style="width:200px"> < p >JQuery</ p > < p >爱,别太认真

QQ空间自动点赞js代码

。_饼干妹妹 提交于 2019-12-06 00:16:00
1、jQuery().each(): each() 方法为每个匹配元素规定要运行的函数。 提示: 返回 false 可用于及早停止循环。 函数原型: function(index,element) 为每个匹配元素规定运行的函数。 index - 选择器的 index 位置。 element - 当前的元素(也可使用 "this" 选择器)。 2、jQuery选择器: 3、jQuery.trigger()方法 trigger() 方法触发被选元素上指定的事件以及事件的默认行为(比如表单提交)。 该方法与 triggerHandler() 方法类似,不同的是 triggerHandler() 不触发事件的默认行为。 与 triggerHandler() 方法相比的不同之处: 它不会引起事件(比如表单提交)的默认行为 .trigger() 会操作 jQuery 对象匹配的所有元素,而 .triggerHandler() 只影响第一个匹配元素。 由 .triggerHandler() 创建的事件不会在 DOM 树中冒泡;如果目标元素不直接处理它们,则不会发生任何事情。 4、jQuery.scroll() 当用户滚动指定的元素时,会发生 scroll 事件。 scroll 事件适用于所有可滚动的元素和 window 对象(浏览器窗口)。 scroll() 方法触发 scroll 事件