![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JS成品代码
文章平均质量分 67
andrewleeeeee
这个作者很懒,什么都没留下…
展开
-
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 · 2045 阅读 · 1 评论 -
jQuery实现品牌列表打开收起
注意: 1.show(); 显示隐藏的匹配元素 2.css(name, value); 给元素设置样式 3.text(string); 设置匹配元素的文本内容 4.filter(expr); 筛选出与制定表达式匹配的元素集合,可以是多个选择器的组合。注意和find()的区别。find()会在元素内寻找匹配元素,而filter()是筛选元素。一个是对它的子集操作,一个是对自身集合元素进行筛选原创 2013-11-15 18:54:27 · 1837 阅读 · 0 评论 -
html5本地存储(Web Storage API)
1.浏览器可以存储5-10M内容,比以往的cookie4k容量高得多,注意是每个域名5M 2.localStorage.setItem ([string]key, [string]value); //用localStorage对象的setItem方法存储键/值,注意键/值只能是字符串,数字或对象不能直接存储 3. var sticky = localStorage.getItem("s原创 2013-11-11 20:03:58 · 1574 阅读 · 0 评论 -
画布canvas,表单选项,随机矩形和圆,文字图像表示
1.canvas画布是web中显示的图形区,上下文context是与画布关联的对象,它定义了一组属性和方法,可以在画布上进行绘画保存恢复等操作。context支持很多接口 2d,webGL等,指定了接口才能进行绘制。 2.ie9以后的版本才支持canvas 3.表单下拉选项的应用: var selectObj = document.getElementById("shape"); //先取原创 2013-11-04 20:39:30 · 1350 阅读 · 0 评论 -
使用XMLHttpRequest进行浏览器和服务器的交互
注意: 1.使用javascript发出HTTP请求时,需要用到XMLHttpRequest对象 2.HTTP相应包括一个相应码,指示是否有错误,request.status == 200 为正常 3.应用中无需重新加载页面,即所谓的AJAX 4.注意XMLHttpRequest的兼容性,1.0和2.0版本都要兼顾,ie8以下只支持1.0,所以使用时要注意, 使用request.onre原创 2013-10-30 19:18:46 · 2242 阅读 · 0 评论 -
JS使用google地图API完成一个完整地图应用
function getMyLocation() { if (navigator.geolocation) //navigator.geolocation属性包含整个地理定位的API,支持的主要方法是getCurrentPosition { navigator.geolocation.getCurrentPosition(displayLocation, displayError);原创 2013-10-23 17:07:27 · 5982 阅读 · 1 评论 -
jquery判断表单是否被选中的小例子
$(document).ready(function(){ var $cr = $("#cr"); $cr.click(function(){ if ($cr.is(":checked")){ alert ("thanks"); } }) })原创 2013-11-12 12:11:53 · 795 阅读 · 0 评论 -
控件播放视频,播放暂停循环等功能,以及画布的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 评论 -
jQuery的动画效果以及图片切换实例
1.动画方法说明: hide() show() //同时修改多个样式属性,就是隐藏显示 fadeIn() fadeOut() //改变透明度显示隐藏 slideUp() slideDown //改变高度上的显示隐藏 fadeTo() //只改变透明度,可替代fadeIn fadeOut toggle() //可替代hide show,轮番切换 slideToggle() //可替代sl原创 2013-11-21 12:15:54 · 923 阅读 · 0 评论 -
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 阅读 · 0 评论 -
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 阅读 · 0 评论 -
简单的小应用-歌曲列表添加(表单输入内容li增加到ul中)
注意: 1.判断表单字符串是否为空,用"",而不是null,因为是字符串 2.使用变量名时不要加双引号 3.appendChild 将元素添加到父元素的后面 4.createElement 可以创建元素 5.save和load使用了localStorage,后面会有介绍 Webville Tunes type="image/ico"原创 2013-10-18 11:22:23 · 436 阅读 · 0 评论 -
计算起点终点之间的距离
function computeDistance(startCoords, destCoords) { var startLatRads = degreesToRadians(startCoords.latitude); var startLongRads = degreesToRadians(startCoords.longitude); var destLatRads = degrees原创 2013-10-23 18:03:29 · 1026 阅读 · 0 评论 -
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 阅读 · 0 评论 -
表单下拉选项selectedIndex的应用:
表单下拉选项的应用: var selectObj = document.getElementById("shape"); //先取表单的下拉菜单 var index = selectObj.selectedIndex; //取当前用户或者默认选择的选项,此处取出一个数组[]0开始 var shape = selectObj[index].value; //根据数组取出value值来使用原创 2013-10-31 19:06:03 · 888 阅读 · 0 评论 -
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 阅读 · 0 评论 -
html5实现视频播放<video>
注意: 1.关于视频格式,不同浏览器支持的不一样,safari--mp4 chrome--webm firefox opera--ogv,ie8或更早的浏览器不支持 2.语句详解 Sorry, your browser doesn't support the video element 3.原创 2013-11-05 19:23:16 · 4118 阅读 · 0 评论