自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(60)
  • 资源 (1)
  • 收藏
  • 关注

原创 扫读浏览

用户都是喜欢扫读文字,接受图片的能力强,大块的文字只会让用户失去耐心,如何让用户方便扫读?1.大标题2.简短的段落,加全部link3.使用列表形式,如LI

2014-03-02 23:42:53 567

转载 jQuery Ajax 实例 全解析

jQuery确实是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯。废话少说,直接进入正题,我们先来看一些简单的方法,这些方法都是对jQuery.ajax()进行封装以方便我们使用的方法,当然,如果要处理复杂的逻辑,还是需要用到jQuery.ajax()的(这个后面会说到).1. load( url, [data], [ca

2013-11-23 10:34:31 471

原创 jQuery选项卡

//$(function(){   var $div_li =$("div.tab_menu ul li");   $div_li.click(function(){$(this).addClass("selected")            //当前元素高亮  .siblings().removeClass("selected");  //去掉其它同辈元素的高亮

2013-11-22 17:11:38 520

原创 jQuery控制字体大小

$(function(){$("span").click(function(){var thisEle = $("#para").css("font-size"); var textFontSize = parseInt(thisEle , 10);var unit = thisEle.slice(-2); //获取单位var cName = $(this).attr("cla

2013-11-22 17:11:07 926

原创 jQuery表单的一些应用

1.按钮增加减少textarea的高度:$(function(){   var $comment = $('#comment');  //获取评论框   $('.bigger').click(function(){ //放大按钮绑定单击事件 if( $comment.height()   $comment.height(  $comment.height() + 50 ); /

2013-11-22 12:16:10 613

转载 jQuery选择器大全

Query 的选择器可谓之强大无比,这里简单地总结一下常用的元素查找方法$("#myELement")    选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素$("div")           选择所有的div标签元素,返回div元素数组$(".myClass")      选择使用m

2013-11-21 19:29:46 425

转载 jQuery学习之prop和attr的区别

.prop()1、.prop( propertyName )获取匹配集合中第一个元素的Property的值2、.prop( propertyName, value ).prop( map ).prop( propertyName, function(index, oldPropertyValue) )给匹配元素集合设定一个或多个属

2013-11-21 19:26:18 376

原创 jQuery的动画效果以及图片切换实例

1.动画方法说明:hide() show() //同时修改多个样式属性,就是隐藏显示fadeIn() fadeOut() //改变透明度显示隐藏slideUp() slideDown //改变高度上的显示隐藏fadeTo() //只改变透明度,可替代fadeIn fadeOuttoggle() //可替代hide show,轮番切换slideToggle() //可替代sl

2013-11-21 12:15:54 923

转载 Math常用方法

1.丢弃小数部分,保留整数部分parseInt(5/2)2.向上取整,有小数就整数部分加1Math.ceil(5/2)3,四舍五入.Math.round(5/2)4,向下取整Math.floor(5/2)Math 对象的方法FF: Firefox, N: Netscape, IE: Internet Explorer方法 描述

2013-11-21 12:08:01 1047

原创 toggle()方法

toggle(函数1, 函数2, 函数3.....); 用于模拟鼠标连击事件,第一次触发函数1,第二次触发函数2.。。。 循环到函数1多用于显示隐藏操作    $(function() {       $("#panel h5.head").toggle(function(){           $(this).addClass("highlight");       

2013-11-18 22:27:12 1184

原创 bind()的简写

bind给对象绑定事件,一般写为 $("div").bind("click", function(){}), 可以简写为  $("div").click(function(){})

2013-11-18 09:40:12 439

原创 jQuery mouseover弹出title以及弹出大图的例子

文字提示  body{margin:0;padding:40px;background:#fff;font:80% Arial, Helvetica, sans-serif;color:#555;line-height:180%;}p{clear:both;margin:0;padding:.5em 0;}/* tooltip *

2013-11-17 21:29:17 2047 1

原创 jQuery实现品牌列表打开收起

注意:1.show(); 显示隐藏的匹配元素2.css(name, value); 给元素设置样式3.text(string); 设置匹配元素的文本内容4.filter(expr); 筛选出与制定表达式匹配的元素集合,可以是多个选择器的组合。注意和find()的区别。find()会在元素内寻找匹配元素,而filter()是筛选元素。一个是对它的子集操作,一个是对自身集合元素进行筛选

2013-11-15 18:54:27 1837

原创 jquery判断表单是否被选中的小例子

$(document).ready(function(){        var $cr = $("#cr");        $cr.click(function(){            if ($cr.is(":checked")){                alert ("thanks");            }        })    })

2013-11-12 12:11:53 795

原创 jquery经典的.ready

$(document).ready(function(){    alert("12312");});

2013-11-12 12:01:33 465

原创 $表示jquery,jquery对象都是通过$()函数构造出来的,就是一个jquery对象的构造工厂

$表示jquery,jquery对象都是通过$()函数构造出来的,就是一个jquery对象的构造工厂

2013-11-12 11:56:12 578

原创 DOM对象和jquery对象

$开头的表示jquery对象,没有则为DOM,这两个对象的方法不能通用var $variable = ....var variable = ...

2013-11-12 11:52:46 456

原创 jquery良好的代码风格

同一对象不超过3个操作的可以写成一行$("li").show().unbind("click");同一对象较多操作的,每行写一个操作$(this).removeClass("mouseout")            .addClass(mouseover)            .stop()            .fadeTo("fast", 0.6); 

2013-11-12 11:51:43 643

原创 jquery的链式代码风格

$(".level1 > a").click(function() {$(this).addClass("current").next().show().parent().siblings().children("a").removeClass("current").next().hide();return false;})当点击到a元素(class含有level1的字元素

2013-11-12 11:47:35 783

原创 html5本地存储(Web Storage API)

1.浏览器可以存储5-10M内容,比以往的cookie4k容量高得多,注意是每个域名5M2.localStorage.setItem ([string]key, [string]value);  //用localStorage对象的setItem方法存储键/值,注意键/值只能是字符串,数字或对象不能直接存储3.    var sticky = localStorage.getItem("s

2013-11-11 20:03:58 1576

原创 splice 删除数组元素

splice(num1, num2);从数组中,第一个位置开始到第二个位置的元素,都删除

2013-11-11 19:50:36 471

转载 substring和substr的用法

substring 方法用于提取字符串中介于两个指定下标之间的字符substring(start,end)开始和结束的位置,从零开始的索引参数     描述start     必需。一个非负的整数,规定要提取的子串的第一个字符在 stringObject 中的位置。stop     可选。一个非负的整数,比要提取的子串的最后一个字符在 stringObject 中的

2013-11-11 12:26:57 639

原创 控件播放视频,播放暂停循环等功能,以及画布的scratch缓冲处理视频

1.scratch缓冲画布是怎么工作的,由最下层的video,中间的处理画布,最上层的展现画布组成2.视频的一帧 = 一个像素 = 4个值(R G B ALPHA)var videos = {video1: "video/demovideo1",video2: "video/demovideo2"};var effectFunction =

2013-11-06 17:45:11 1622 1

原创 加载图片Image方法

var twitterBird = new Image();    twitterBird.src = "twitterBird.png";或者     var newImage = "url(images/" + idToPush + "pressed.png)" ;

2013-11-06 12:38:34 521

原创 indexOf()指出字符串的所处位置(整数)

var str="Hello world!"document.write(str.indexOf("Hello") + "")document.write(str.indexOf("World") + "")document.write(str.indexOf("world"))返回整数,分别是0,-1(因为大小写敏感),6

2013-11-06 12:19:40 447

原创 target.getAttribute获取调用这个程序的元素的属性或id等

如:function setEffect(e){var id = e.target.getAttribute("id");  //获取调用setEffect函数元素的id}   //会是4个中的1个

2013-11-06 12:15:18 5581

原创 querySelectorAll选择器

html5引入的一种选择器,类似于getElementByTagName ,但是返回的是一个元素对象数组如:var controls = document.querySelectorAll("a.control");   // a标签下class=control的元素数组再如document.querySelectorAll("div")

2013-11-05 21:12:44 618

原创 html5实现视频播放<video>

注意:1.关于视频格式,不同浏览器支持的不一样,safari--mp4  chrome--webm firefox opera--ogv,ie8或更早的浏览器不支持2.语句详解                                 Sorry, your browser doesn't support the video element3.

2013-11-05 19:23:16 4123

原创 addEventListener方法来注册事件给对象

类似 window.onload = function.... 这种事件处理方法,是直接将函数赋给对象属性addEventListener方法可以直接注册事件给对象,用于类似html5视频googlemap api调用等场合var video;video.addEventListener("ended", nextVideo, false);  参数1:监听事件名称,类

2013-11-05 14:17:03 1153

原创 画布canvas,表单选项,随机矩形和圆,文字图像表示

1.canvas画布是web中显示的图形区,上下文context是与画布关联的对象,它定义了一组属性和方法,可以在画布上进行绘画保存恢复等操作。context支持很多接口 2d,webGL等,指定了接口才能进行绘制。2.ie9以后的版本才支持canvas3.表单下拉选项的应用:var selectObj = document.getElementById("shape");  //先取

2013-11-04 20:39:30 1351

原创 表单下拉选项selectedIndex的应用:

表单下拉选项的应用:var selectObj = document.getElementById("shape");  //先取表单的下拉菜单var index = selectObj.selectedIndex;  //取当前用户或者默认选择的选项,此处取出一个数组[]0开始var shape = selectObj[index].value;  //根据数组取出value值来使用

2013-10-31 19:06:03 890

原创 JSONP解决跨域取数据的问题

1.就是在html尾部添加script src标签,只不过src地址要加参数(或者叫包装函数),参数即js要使用的函数   如:2.例如callback这种参数,要看对方服务器的要求添加3.这种方法,返回来的即已是js对象,无需像XMLHttpRequest使用JSON.Parse转换4.XMLHttpRequest为了避免恶意的js访问你的服务器,所以不允许跨域,JSONP可以

2013-10-30 20:04:05 895

原创 使用XMLHttpRequest进行浏览器和服务器的交互

注意:1.使用javascript发出HTTP请求时,需要用到XMLHttpRequest对象2.HTTP相应包括一个相应码,指示是否有错误,request.status == 200 为正常3.应用中无需重新加载页面,即所谓的AJAX4.注意XMLHttpRequest的兼容性,1.0和2.0版本都要兼顾,ie8以下只支持1.0,所以使用时要注意,使用request.onre

2013-10-30 19:18:46 2242

原创 setInterval定时器

其实是windows对象的方法:setInterval(handleRefresh, 3000);  //每多少毫秒调用函数handleRefreshfunction handleRefresh(){alert("timeup!");}

2013-10-30 18:45:17 406

原创 JSON就是一个对象的数组

如var sales = [    {"name":"abc", "time":321, "sale":8},  //对象{"name":"abc", "time":321, "sale":8},{"name":"abc", "time":321, "sale":8}]  //数组

2013-10-30 11:47:34 619

原创 JSON小例子:对象和json串之间转换

1.对象转json串:用于上传服务器var Movie = new Movie ("plan 9", "Classic", 2, "3:00pm");var jsonString = JSON.stringify(Movie);  alert (jsonString); 2.json串转对象:用于从服务器取回串后,转为对象进行显示加工var jsonObject = J

2013-10-28 13:13:53 325

原创 计算起点终点之间的距离

function computeDistance(startCoords, destCoords) {var startLatRads = degreesToRadians(startCoords.latitude);var startLongRads = degreesToRadians(startCoords.longitude);var destLatRads = degrees

2013-10-23 18:03:29 1030

原创 Google地图与js地图API

js的地图API能进行定位等功能,但不能给出可视化的表现,这就需要利用GoogleMap这种第三方工具进行可视化表现

2013-10-23 17:58:59 524

原创 JS使用google地图API完成一个完整地图应用

function getMyLocation(){if (navigator.geolocation)   //navigator.geolocation属性包含整个地理定位的API,支持的主要方法是getCurrentPosition{navigator.geolocation.getCurrentPosition(displayLocation, displayError);

2013-10-23 17:07:27 5990 1

原创 什么是API

API就是带有属性和方法的对象,如位置定位对象 navigator.geolocation,包含了整个地理定位的API

2013-10-22 18:20:34 373

锋利的jQuery(第2版)源码

锋利的jQuery(第2版)源码, 包含了全部小节的实例

2013-11-21

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除