Chrome开发者工具的小技巧收集整理

Chrome的开发者工具是个很强大的东西,相信程序员们都不会陌生,不过有些小功能可能并不为大众所知,所以,写下这篇文章罗列一下可能你所不知道的功能,有的功能可能会比较实用,有的则不一定,也欢迎大家补充交流。话不多话,我们开始。 代码格式化 有很多css/js的代码都会被 minify 掉,你可以点击代码窗口左下角的那个 { } 标签,chrome会帮你给格式化掉。 强制DOM状....
  •   
  • 287
  • jquery
  • 34
  • dodobook
  • 2017/02/08
hover3d

仿锤子手机的3D画廊banner的效果jQueryHover3d

最近因为老罗的情怀情不自禁的去关注了一下锤子手机。打开官网之后 http://www.smartisan.com/#/ 被锤子手机的画廊的3D效果深深的吸引了。所以想借鉴学习一下,网上搜罗一下,整理了一下写了一个demo如下,欢迎各位指点。 此demo使用的是jQuery Hover3d的js框架,需要jquery的支持。 可直接查看效果以及下载该demo(有美女哦) 仿锤子手机的3D画廊的效果DEMO及下载 直接上....
  •   
  • 801
  • jquery
  • 41
  • dodobook
  • 2016/12/01

分享几个日常js调试方法让js调试更简单

对于网页开发,js的开发和调试时每日工作的必备饭点,下面分享几个日常调试代码的时候在Console命令行显示你的操作,让你的js调试更简单。 console显示信息的命令 在浏览器按f12在console上显示你的文本。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>JS调试方法</title> </head> <body&g....
  •   
  • 268
  • jquery
  • 37
  • dodobook
  • 2016/11/07
Web_tag20161014175506

使用JS生成随机的Web安全色

今天想到需要给每篇文章加上标签,类似标签云,但是统一色调的标签云不美观。这个时候就想到了随机生成每个标签的背景颜色。请看示例图片: 如果想知道网站的配色方案请异步浏览WEB网站网页设计常用色彩搭配表 获取随机颜色 function getRandomColor() { return '#'+('00000'+(Math.random()*0x1000000<<0).toString(16)).slice(-6); } 获取随机安全色:这里....
  •   
  • 622
  • jquery
  • 32
  • dodobook
  • 2016/10/14

使用AJAX的JSONP类型跨域请求的方法和示例

最近在学习使用ajax的jsonp的数据类型进行跨域请求,jsonp的形式的接口数据请求和返回是不一样的。是返回callback形式的。直接上示例代码,实现功能为主,理论知识自行百度google. AJAX部分请求接口 //不跨域的情况下面默认 $.getJSON("http://aaa.dodobook.net/ulogin.php", {user_id:'4999'}, function(data){ alert(data); }); //跨域的情况下 ....
  •   
  • 350
  • jquery
  • 38
  • dodobook
  • 2016/09/22
js_mouse_move_star

JS打造的跟随鼠标移动的小星星组成的图案

今天想继续打造改造一下跟随鼠标移动的动画的效果,无意间浏览到一个很不错的js效果,动感十足,Mark转载记录一下.效果如下,欢迎各位改造体验.直接上示意图和代码段. ===猛戳体验地址=== ===猛戳体验地址=== <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>JS打造的跟随鼠标移动的小....
  •   
  • 439
  • jquery
  • 9
  • dodobook
  • 2016/09/19

手机Wap微信端上传单图和上传多图的DEMO

在手机端或者微信端的论坛或者报名等界面需要上传头像或者多张图片信息等。这个时候就需要用到手机端的上传图片功能,现在微信端也可以使用input file功能了。多图上传使用的都是ajax方式。ajax返回的是标准的json格式,json包括三个字段 error(为0正确上传成功) msg(正确或者错误的提示信息) info(正确的时候返回图片的地址信息)ajax图片上传依赖于jquery。示例demo图片如....
  •   
  • 975
  • jquery
  • 7
  • dodobook
  • 2016/06/02

手机Wap微信端的弹出提示框弹出层的DEMO(简洁实用)

做手机wap网站或者微信端的微网站等经常需要对用户的操作进行一些友好的提示和信息的展示,好的UI可以提高网站的整体水准,高大上。这里主要展示一个网站的弹出提示框或者是弹出层等。此部分依赖于jquery,js和css都直接展示在下方了,非常简洁。直接上代码DEMO。 效果如下图所示: <!DOCTYPE html> <html lang="en"> <head> <meta c....
  •   
  • 627
  • jquery
  • 8
  • dodobook
  • 2016/06/02

JavaScript实现短信发送时候的倒计时功能Demo

在网站注册的时候,需要发送短信验证码,短信验证码一般都会延迟一下,所以当点击了该按钮后一般都会给一个倒计时的功能,一方面提示用户短信验证码的发送情况,一方面禁止用户短时间内重复点击造成不必要的开销和疑惑。先前想到用for循环,没有很顺畅。直接上代码段。各位小伙伴们自行领悟。方法里面执行本方法。 var wait = 60; //60秒倒计时 var isClick = 0; ....
  •   
  • 707
  • jquery
  • 10
  • dodobook
  • 2016/03/30

使用Jquery.Cookie进行记录网页信息以及页面间数据传递

在一些项目中可能需要记录用户的点击信息,譬如后台的左边菜单栏点击了其中一个呈现展开或者明显加粗选中的形式。以及页面之间的数据传递等都可以使用jquery.cookie来记录。从一定程度上替代了服务端的session或者url上面的传递参数。实现这个方案可能有很多种方式。 此处的需求是,当页面左边菜单栏点击了某个菜单,该菜单选中状态,就保存在jquery.cookie里面,页面刷新或....
  •   
  • 628
  • jquery
  • 0
  • dodobook
  • 2015/11/16

[转]五个写js的坏习惯,你中枪了吗?

Javascript在互联网上名声很臭,但你又很难再找到一个像它这样如此动态、如此被广泛使用、如此根植于我们的生活中的另外一种语言。它的低学习门槛让很多人都称它为学前脚本语言,它另外一个让人嘲笑的东西是动态语言的概念是偏偏使用了高标准的静态数据类型。其实,你和Javascript都站错了立场,而现在,你让Javascript很生气。这里有五个原因能说明你的Javascript技术很烂....
  •   
  • 627
  • jquery
  • 0
  • dodobook
  • 2015/10/29

使用PHP或Js来判断是否使用了微信浏览器

在进行微信公众账号开发或者手机网站开发的时候,其中很大一块是微站点的开发,我们需要知道当前的浏览器是微信内置的浏览器,如果是微信浏览器的话,展示微信支付等相关内容,那么如何判断呢? 至于如何判断微信内置浏览器,我们需要获取到微信内置浏览器的 User Agent,首先需要获取微信内置浏览器的User Agent,经过在 iPhone 上微信的浏览器的检测,它的 User Agent 是....
  •   
  • 581
  • jquery
  • 0
  • dodobook
  • 2015/10/22

关于PHP和javaScript中共用cookie与session的研究

关于cookie和session的机制就不多记录,直接进入主题。 最近遇到一个问题主要是为了实现用户分享出一篇文章后,他们的朋友阅读该文章,首次阅读的时候他得到奖励,他朋友多次刷新的时候就不予以赠送。(有多种方法可实现该功能需求,A借助数据库记录判断(开销太大且阅读者需要标识ip等。不建议用) B,利用本地缓存localStroage和ajax实现,C本地缓存和url跳转参数实现,D使....
  •   
  • 929
  • jquery
  • 2
  • dodobook
  • 2015/10/13

javascript 中查找指定字符串indexOf(),lastIndexOf(),match()

在javascript中,有以下三个方法均可实现在字符串中查找指定的字符及字符串。 str.indexOf(); 此方法:查找字符在字符串对象中第一次出现的位置。存在,则返回字符串所在的位置。不存在,则返回-1。 str.lastIndexOf(); 该方法查找字符在字符串对象中最后一次出现的位置。存在,则返回字符串所在的位置。不存在,则返回-1。 str.match();访方法查找字符串中的指定字符及字....
  •   
  • 626
  • jquery
  • 0
  • dodobook
  • 2015/10/12

JavaScript获取当前页面的URL地址document.URL

当页面需要获得当前URL进行组装或者使用的时候,我们需要得到当前文件的URL地址,可以有多种方法得到,最简单的方式就是直接使用document.URL即可。 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>JavaScript获取当前页面的URL地址</title> </head> <body> <....
  •   
  • 648
  • jquery
  • 0
  • dodobook
  • 2015/10/12

JavaScript replace()替换字符串里面所有字符/g 忽略大小写/i

JavaScript replace()方法,替换字符串里面所有的字符/g 忽略大小写/i 定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。 JavaScript replace的语法 stringObject.replace(regexp,replacement) regexp 必需。规定了要替换的模式的 RegExp 对象。请注意,如果该值是一个字符串,则将它作为要检索的直接量文本模....
  •   
  • 730
  • jquery
  • 0
  • dodobook
  • 2015/10/12

Jquery中替换节点的方法replaceWith()和replaceAll()

在jquery中,我们可以通过replaceWith()和replaceAll()方法来替换元素中的节点。两者使用的语法格式: replaceWith(content) : 将所有选择的元素替换成指定的html和dom元素。其中参数被选择替换的内容。 replaceAll(selector) : 替换指定的selector元素。 示例:在下面的页面中存在两个span标记。通过上面两个函数分别替换元素的内容 <!doctype html> ....
  •   
  • 880
  • jquery
  • 2
  • dodobook
  • 2015/10/12

Javascript数组键值对(key和value)的concat以及数组的循环遍历

在处理Javascript数组的时候,需要建立键值对(key和value)的数组,当数组形成之后又需要把数组合并或者连接,可以直接使用concat,同时也可以使用push函数。组装成为新的数组之后就需要对JavaScript里面的数组进行循环遍历。譬如购物车里面多个商品的总金额的计算。下面直接上代码。请各位自己领悟。。 <!DOCTYPE html> <html lang="en"> <he....
  •   
  • 886
  • jquery
  • 3
  • dodobook
  • 2015/09/14

BootStrap3 弹出的 模态框垂直居中问题(手机弹出层)

在网页开发中,包括手机开发中,手机弹出层的,Bootstrap被广泛的使用,Bootstrap的模态框是很出色的一个组件,能够及时的提示用户,友好的UI和编辑的操作方便用户使用。同时在手机展示页面也能很好的兼容。正常情况下模态框是比较靠近页面的头部,看了一下css 里面有padding-top:30px这个样式。所以正常情况下模态框是距离头部30px. 手机和电脑端的弹出层垂直居中会使页面....
  •   
  • 7732
  • jquery
  • 10
  • dodobook
  • 2015/07/15

jQuery实现点赞加1(点赞动画)的效果

经典分享类的文章页面中,为了最大可能性的和用户互动,保持用户的粘性,帖子点赞,文章点赞,回复点赞,以及踩一下,扔鸡蛋等常常是用户所喜爱的最直接简单的表达情感和意见的方式。那我们来简要的看一下实现点赞的方法和方式。点赞的动画效果主要是点击按钮或者链接的时候,触发动画效果。当然你也可以使用ajax请求后端的数据库对点赞数目统计。下面直接上图示和代码。你....
  •   
  • 4004
  • jquery
  • 2
  • dodobook
  • 2015/06/17