JavaScript&jQuery - 随笔分类(第2页) - Joanna Qian

jQuery学习小结2——动画

摘要：一、基础动画方法名说明show([speed,[easing],[fn]])hide([speed,[easing],[fn]])speed:三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(分别对应600 毫秒、400 毫秒和200 毫秒)e... 阅读全文

posted @ 2014-04-14 23:38 Joanna Qian 阅读(290) 评论(0) 推荐(0) 编辑

jQuery学习小结1-CSS操作+事件

摘要：一、DOM对象和jQuery 对象互换1、jQuery对象就是通过jQuery包装DOM对象后产生的对象。jQuery对象是jQuery独有的，其可以使用jQuery里的方法。比如：$("#test").html() 意思是指：获取ID为test的元素内的html代码。其中html()是jQuery... 阅读全文

posted @ 2014-04-09 01:56 Joanna Qian 阅读(480) 评论(0) 推荐(0) 编辑

Metro UI（Win 8风格）页面设计小记

摘要：一、Metro风格菜单——简单HTML Tile 1 Tile 2 Tile 3 Tile 4 Tile 5 ... 阅读全文

posted @ 2014-03-05 04:55 Joanna Qian 阅读(1357) 评论(0) 推荐(1) 编辑

jQuery Easing动画效果扩展（转）

摘要：jQuery API提供了简单的动画效果如淡入淡出以及自定义动画效果，而今天我给大家分享的是一款jQuery动画效果扩展增强插件jquery.easing.js，使用该插件可以实现直线匀速运功、变加速运动、缓冲等丰富的动画效果。jQuery Easing是一款比较老的jQuery插件，在很多网站都有应用，尤其是在一些页面滚动、幻灯片切换等场景应用比较多。它非常小巧，且有多种动画方案供选择，使用简单，而且免费。官网 demo引入Easing js文件该插件基于jQuery，所以需要同时引入jQuery库文件和Easing js文件。使用jQuery EasingjQuery Easi... 阅读全文

posted @ 2014-02-25 23:50 Joanna Qian 阅读(626) 评论(0) 推荐(0) 编辑

JQUERY获取当前页面的URL信息

摘要：最主要就是获取当前URL的详细信息，就可以进行判断了，这就需要用到JQUERY获取URL的函数。这里与大家分享一下，没用过这种方法的朋友可以尝试一下。一、window.location属性描述hash设置或获取 href 属性中在井号“#”后面的分段。host设置或获取 location 或 URL 的 hostname 和 port 号码。hostname设置或获取 location 或 URL 的主机名称部分。href设置或获取整个 URL 为字符串。pathname设置或获取对象指定的文件名或路径。port设置或获取与 URL 关联的端口号码。protocol设置或获取 URL 的协议部阅读全文

posted @ 2014-02-25 03:09 Joanna Qian 阅读(3290) 评论(0) 推荐(0) 编辑

JQuery时间轴timeline插件的学习-Lateral On-Scroll Sliding with jQuery+technotarek / timeliner

摘要：一、Lateral On-Scroll Sliding with jQuery的使用View demo Download source1. HTML结构 November 2011 Some title November 28, 2011 Some Title ... 阅读全文

posted @ 2014-02-19 03:34 Joanna Qian 阅读(979) 评论(0) 推荐(0) 编辑

jQuery制作瀑布流(转)

摘要：“瀑布流布局”随着pinterest网的流行而出名，现在国内使用这种风格布局的网站也越来越多，比如说Mark之，蘑菇街，点点网，哇哦等等。我第一次听到这个布局名称是来自于“乔花写的《瀑布流布局浅析一文”，之后在群里也时不时有同学会问有关于这种布局的使用方法。今天我老话重谈，主要向大家介绍一些相关的制作插件，以及成功的案例，希望能给大家今后的工作有所帮助。制作瀑布流布局的优秀插件首先简单的向大家推荐几款制作瀑布流的jQuery插件，这些插件能帮助大家轻松的实现类似于pinterest的布局效果：1.MasonryMasonry是一个动态的网格布局插件。每个元素水平方向都采用全float布局，但在阅读全文

posted @ 2014-02-10 23:22 Joanna Qian 阅读(985) 评论(0) 推荐(0) 编辑

16个时髦的扁平化设计+视觉滚差的网站模板

摘要：Persona – HTML5 Parallax Portfolio Theme充满吸引力的一款网站模板，扁平化设计风格，动感的视差滚动效果。在线演示模板下载Superb – Responsive One-Page PortfolioSuperb 是一个基于 HTML5 & CSS3 的响应式单页作品集网站模板。在线演示模板下载Next – Unique & Easy Portfolio Template这款精美的网站模板提供了三套风格的设计：全屏背景、单页滚动以及 Metro 面板。在线演示模板下载Creatrix – Flat Responsive Template扁平化设阅读全文

posted @ 2014-01-25 05:18 Joanna Qian 阅读(1527) 评论(0) 推荐(0) 编辑

javascript中的defer和async学习+javascript执行顺序

摘要：一、defer和async我们常用的script标签，有两个和性能、js文件下载执行顺序相关的属性：defer和asyncdefer的含义【摘自https://developer.mozilla.org/En/HTML/Element/Script】——This Boolean attribute is set to indicate to a browser that the script is meant to be executed after the document has been parsed.async的含义【摘自https://developer.mozilla.org/En 阅读全文

posted @ 2014-01-14 04:20 Joanna Qian 阅读(1952) 评论(0) 推荐(0) 编辑

JSONP的学习（收集整理）

摘要：JSONP和JSON之间有什么联系吗？JSON(JavaScript Object Notation) 是一种轻量级、可读的基于文本的的数据交换格式。，是一种轻量的数据交换开放标准。源于JavsScript编程语言中对简单数据结构和关联数组的展示功能。它是仅含有数据对和简单括号结构的纯文本，因此可通过许多途径进行JSON消息的传递。对于JSON大家应该是很了解了吧，不是很清楚的朋友可以去json.org上了解下。1. JSONP定义 JSONP是英文JSON with Padding的缩写，是一个非官方的协议。它允许在服务器端生成script tags返回至客户端，通过javascript c 阅读全文

posted @ 2014-01-09 01:08 Joanna Qian 阅读(823) 评论(0) 推荐(1) 编辑

iscroll4框架解析[webapp开发]（转）

摘要：概要iScroll 4 这个版本完全重写了iScroll这个框架的原始代码。这个项目的产生完全是因为移动版webkit浏览器（诸如iPhone，iPad，Android这些系统上广泛使用）提供了一种本地化的方式来对一个限定了高度和宽度的元素的内容进行滑动。很不幸的是，这种情况下所有的web应用的页面就不能够包含具有position:absolute的头、页尾或者是一个内容可滚动的中间区域。然而，Android系统最新修订版已经可以支持这种功能了（尽管支持的力度还不是特别好），Apple公司似乎不太情愿将one-finger滑动事件运用到div元素上。除了以前版本的iScroll的特性以外，iS 阅读全文

posted @ 2013-12-17 04:10 Joanna Qian 阅读(323) 评论(0) 推荐(0) 编辑

IE9中Media queries在iframe无效的解决方法

摘要：在css中有5个media querie@media screen and(min-width:0px)and(max-width:319px){ body {background-color:red;}}@media screen and(min-width:320px)and(max-width:480px){ body {background-color:orange;}}@media screen and(min-width:481px)and(max-width:980px){ body {background-color:yellow;}}@media scree... 阅读全文

posted @ 2013-12-17 03:58 Joanna Qian 阅读(1240) 评论(0) 推荐(0) 编辑

mustache模板技术

摘要：一、简介Web 模板引擎是为了使用户界面与业务数据（内容）分离而产生的，它可以生成特定格式的文档，通常是标准的 HTML 文档。当然不同的开发语言有不同模板引擎，如 Javascript 下的 Hogan 、ASP 下的 aspTemplate、以及 PHP 下的 Smarty，这里主要介绍基于 Javascript 语言的模板引擎，目前流行有 Mustache、Hogan、doT.js、JsRender、Kendo UI Templates等，jsperf.com 上可以看到它们的性能对比。Mustache 是一个轻逻辑的模板语言（ Logic-less templates），mustach 阅读全文

posted @ 2013-12-06 23:45 Joanna Qian 阅读(15271) 评论(0) 推荐(1) 编辑

在JSP中使用jQuery的冲突解决（收集整理）

摘要：在JSP中使用来嵌套页面的时候，会出现jQuery之间的冲突解决办法：在需要嵌套的页面中有jQuery引入冲突问题的地方做如下处理：var $jq = jQuery.noConflict();$jq(document).ready(function(){ $jq("select").sSelect(); });在这个示例中，使用$jq来代替，即可解决冲突的问题。原理：由于jQuery以及 prototype.js，coypSelect.js都使用了美元符函数“$”作为选择器，在两者混合使用的时候$函数被重复定义了，结果导致其中一个框架不能使用。方法一： ... 阅读全文

posted @ 2013-12-03 05:28 Joanna Qian 阅读(1853) 评论(0) 推荐(0) 编辑

Front End中Javascript兼容问题收集（转）

摘要：1 select标签,就有诸多不兼容: A、 cloneNode方法,对于非IE浏览器没有问题,对于IE浏览器, 遇到的问题包括: 1)option selected的会clone不过去,然后会将第一个option作为selected值 2)事件clone也会有问题 B、Readonly:对于IE6,可以通过以下方法将select设为readonly:obj.onbeforeactive=function(){return false}obj.onfocus=function(){obj.blur();}obj.onmouseover=function(){obj.setCaptu... 阅读全文

posted @ 2013-11-29 04:28 Joanna Qian 阅读(469) 评论(0) 推荐(0) 编辑

关于document.createDocumentFragment()（转）

摘要：documentFragment 是一个无父对象的document对象.他支持以下DOM2方法:appendChild, cloneNode, hasAttributes, hasChildNodes, insertBefore, normalize, removeChild, replaceChild.也支持以下DOM2属性:attributes, childNodes, firstChild, lastChild, localName, namespaceURI, nextSibling, nodeName, nodeType, nodeValue, ownerDocument, pare 阅读全文

posted @ 2013-11-28 02:43 Joanna Qian 阅读(462) 评论(0) 推荐(0) 编辑

鼠标捕获(setCapture，releaseCapture)的学习

摘要：鼠标捕获(setCapture)作用是将鼠标事件捕获到当前文档的指定的对象——对指定的对象设置鼠标捕获。这个对象会为当前应用程序或整个系统接收所有鼠标事件。所谓鼠标捕获，是指对鼠标事件（onmousedown, onmouseup, onmousemove, onclick, ondblclick, onmouseover, onmouseout）进行捕捉，使在容器内的子对象的鼠标事件均由容器对象触发，因此，只能在容器对象的鼠标事件函数中进行处理。当参数为true时，对鼠标进行捕捉，相反，不捕捉。与这个函数对应，releaseCapture方法释放鼠标捕获，并触发onlosecapture事阅读全文

posted @ 2013-11-27 03:00 Joanna Qian 阅读(5051) 评论(0) 推荐(1) 编辑

jquery 中json数组的操作(转）

摘要：在jquery中处理JSON数组的情况中遍历用到的比较多，但是用添加移除这些好像不是太多。今天试过json[i].remove(),json.remove(i)之后都不行，看网页的DOM对象中好像JSON数据是以数组的形式出现的，查阅了下相关JS中数组的操作一试果然很爽。记录下来。1、数组的创建var arrayObj = new Array();　//创建一个数组var arrayObj = new Array([size]);　//创建一个数组并指定长度，注意不是上限，是长度var arrayObj = new Array([element0[, element1[, ...[, elem 阅读全文

posted @ 2013-11-22 00:00 Joanna Qian 阅读(2728) 评论(0) 推荐(0) 编辑

巧用JS中的join方法操作字符串

摘要：1、将数组的元素组起一个字符串，以separator为分隔符，省略的话则用默认用逗号为分隔符/***把数组转换成特定符号分割的字符串*/function arrayToString(arr,separator) {if(!separator) separator = "";//separator为null则默认为空 return arr.join(separator);}/*** 查找数组包含的字符串*/function arrayFindString(arr,string) {var str = arr.join(""); return str.ind 阅读全文

posted @ 2013-11-19 05:15 Joanna Qian 阅读(2258) 评论(0) 推荐(0) 编辑

jquery load ($.load) 事件用法与分析(转)

摘要：首先我们需要清楚的是jquery load方法是对jQuery.ajax()进行封装以方便我们使用的一个方法，当我们需要处理较为复杂的逻辑时候，还是需要用到jQuery.ajax()这个比较全面的方法的。load( url, [data], [callback] )其中:url：是指要导入文件的地址。data：可选参数；因为Load不仅仅可以导入静态的html文件，还可以导入动态脚本，例如PHP文件，所以要导入的是动态文件时，我们可以把要传递的参数放在这里。callback：可选参数；是指调用load方法并得到服务器响应后，再执行的另外一个函数。下面给出几个用法示例：1.加载一个php文件，该阅读全文

posted @ 2013-11-19 03:05 Joanna Qian 阅读(642) 评论(0) 推荐(0) 编辑

随笔分类 - JavaScript&jQuery