分类目录归档：全部列表

2014
11-11

如何在浏览器端加密——使用Javascript加密解密

在创建Opal网站时，我们所面临的挑战，是寻找在浏览器中加密解密的可靠方法。这篇文章描述了浏览器端加密所面临的难题，并指出了近期的科技进步所提供的一种解决方案。在Web应用中加密的三种选择只有JavaScript才是所有浏览器都支持的语言。与Opal同类的Web应用使用JavaScript编写，以便于在任何现代浏览器上运作。如果这些应用要使用加密函数，那么JavaScript必须能够访问到它们。目前，要把加密函数暴露给浏览... 继续阅读 >
2014
11-11

Flash图片上传插件——CFUpdate文件批量上传组件

搞开发的同学都知道，网上可搜到的可用的Flash图片上传的组件少之又少，可定制界面，不需要安装组件，且可免费用于任何商业系统的，更是凤毛麟角，如果你和我一样，迫切需要一款这样的一款组件的话，不妨试试CFUpdate吧。以下是我修改的一个Demo效果，你也可以猛击此处查看在线Demo。CFUpdate可选择多个图片上传，显示上传速度、进度条、文件名称等，可拖动排序文件顺序，CFUpdate使用的是HTTP协议，所以客户端，服务端都不需要... 继续阅读 >
2014
11-11

Flash仿新浪微博头像上传插件破解加强版

如题，仿新浪微博头像上传插件，并在此基础上增加了放大/缩小功能及图片调整功能，感谢zhushunqing为我们提供的flash源文件。Git地址：https://github.com/zhushunqing/FaustCplus演示Demo地址: http://flashman.com.cn/Flash/FaustCplus/common/下载地址：百度网盘下载FLA源文件请用AdobeFlashCS5或以上版本打开。修改头像规格及大小的方法，找到main.as中的Param.pSize=this.parameter["pSize"]?(this.parameter["... 继续阅读 >
2014
11-11

给JavaScript初学者的23条最佳实践

1.使用===代替==JavaScript使用2种不同的等值运算符：===|!==和==|!=，在比较操作中使用前者是最佳实践。“如果两边的操作数具有相同的类型和值，===返回true，!==返回false。”——《JavaScript：语言精粹》然而，当使用==和！=时，你可能会遇到类型不同的情况，这种情况下，操作数的类型会被强制转换成一样的再做比较，这可能不是你想要的结果。2.Eval=邪恶起初不太熟悉时，“eval”让我们能够访问JavaScript的编译器... 继续阅读 >
2014
11-11

编写更好的jQuery代码的建议

讨论jQuery和javascript性能的文章并不罕见。然而，本文我计划总结一些速度方面的技巧和我本人的一些建议，来提升你的jQuery和javascript代码。好的代码会带来速度的提升。快速渲染和响应意味着更好的用户体验。首先，在脑子里牢牢记住jQuery就是javascript。这意味着我们应该采取相同的编码惯例,风格指南和最佳实践。首先，如果你是一个javascript新手，我建议您阅读《JavaScript初学者的最佳实践》，这是一篇高质量的javascr... 继续阅读 >
2014
11-11

如何利用 Bootstrap 进行快速 Web开发

入门下载已编译的Bootstrap数据包（可以去这里下载）。我在本文中使用的是V2.3.2。下载内容包括Bootstrap的关键元素CSS，以及一些有用的图像和JavaScript文件。您可以根据我在文中的描述为Web页面提供HTML。Bootstrap文档中不包含框架支持的许多设计选项的样例HTML。但是Bootstrap文档页面（尽管其本身已说明了Bootstrap的灵活性）还不足以解释真正起作用的基本设计原则。响应式Web设计查看Web页面的设备... 继续阅读 >
2014
11-11

jquery实现div层随页面滚动而滚动（固定在某一位置）

翻看ipc.me时觉得右侧的slider会随着页面下翻而始终浮动在窗口边沿下，体验很不错，在张鑫旭的博客中一篇文章的借鉴下，成功实现这样一个功能，代码如下（基于jquery实现，所以事先要在页面中导入jquery文件）：<scripttype="text/javascript">$.fn.smartFloat=function(){varposition=function(element){vartop=element.position().top,pos=element.css("position");$(window).scroll(functio... 继续阅读 >
2014
11-11

jquery.min.map 404 (Not Found)出错的原因及解决办法

Chrome更新后出现了jquery.min.map404 (NotFound)的信息这个到底是什么东西？查询了一下，得到了以下资料JQuery官方解释摘录一下內容从jQuery1.9.0版本后在原始代码里会有 @sourceMappingURL=jquery.min.map什么是Sourcemap简单说，Sourcemap就是一个信息文件，里面存储着位置信息。也就是说，转换后的代码的每一个位置，所对应的转换前的位置。有了它，出错的时候，除错工具将直接显示原始代码... 继续阅读 >
2014
11-11

你所未必知道的关于<!DOCTYPE>标签的细节

<!DOCTYPE>标签很简单，你或许会不在意。但是你有没有仔细了解过<!DOCTYPE>标签？W3cschool上建议使用XHTMLTransitionalDTD，很多人就很听话地把Dreamweaver的HTML文档类型默认设置为XHTML1.0Transitional。之后就理所当然地一直用到现在了。人这东西还真是，越长大就越懒了，很多东西都被潜意识地当成了理所当然。<!DOCTYPE>的定义<!DOCTYPE>声明位于文档中的最前面的位置，处于<html>标签之前。此标签可告知浏览器文档使用... 继续阅读 >
2014
11-11

Web应用开发中的几个问题——使用javascript开发需知

开篇概述Ajax技术在Gmail中的成功应用，和高性能的V8引擎的推出，使得编写Web应用变得流行起来，使用前端技术也可以编写具有复杂交互的应用。相对于原生应用，Web应用具有如下优点：跨平台，开发和维护成本低；升级和发布方便，没有版本的概念，随时随地发布，用户没有感知，不需要安装；响应式设计(ResponsiveDesign)使得Web应用可以跨平台，同一份代码自适应各种屏幕大小即使最终不采用Web应用方案，也很适合开发原型... 继续阅读 >
2014
11-11

超棒的 15 款 Bootstrap UI 编辑器

自从2011年MarkOtto和JacobThornton开发了 BootStrap，我们第一次接触并熟知了Bootstrap。这些都归功于Twitter！从那以后，它就非常流行并且成为了最好的响应式框架之一。Bootstrap帮助开发者快速高效的开启大量新的web项目，受到了广大开发者们的青睐。为了照顾那些不是很熟悉Bootstrap但是又想继续深入了解的开发者，我们在这里简单的介绍一下。Bootstrap是一个pre-styled组件的扩展库，有着大量的附件和非... 继续阅读 >
2014
11-11

创建您自己的浏览器扩展，第一部分: 将您的触角延伸至Chrome

每个浏览器都有其自己的粉丝、批评者、优势和劣势。它们的共同点是人们将越来越多的时间花费于其中。本系列文章将介绍如何为Chrome、Firefox、InternetExplorer和Safari构建一个浏览器扩展。您可以为每个浏览器构建相同的基础扩展，感受扩展每个浏览器是什么样子，执行这些常见任务是困难还是简单，以及发布您的扩展会涉及到什么。在本文中，您将构建一个Chrome扩展。开始之前对于本文，您需要下载和安装GoogleChromeV... 继续阅读 >
2014
11-11

创建您自己的浏览器扩展，第二部分: 将您的触角延伸至 Firefox

每个浏览器都有其自己的支持者、批评者、优势和劣势。它们的共同点是人们将越来越多的时间花费于其中。本系列文章将介绍如何为Chrome、Firefox和Safari构建相同的基础扩展。您将了解到扩展每个浏览器是什么样子，执行这些常见任务是困难还是简单，以及如何发布您的扩展。在本文中，您将构建一个Firefox扩展。Gawkblocker扩展回忆一下，Gawkblocker支持您（以及其他用户）屏蔽某些您不喜欢访问的域，比如耗时的博客。Gawk... 继续阅读 >
2014
11-11

jquery ajax回调函数中调用$(this)的问题

今天在用jquery的ajax的回调函数时出现了问题，就是在回调函数中不能使用$(this)。这个问题一直弄了很久，怎么也解决不了，后来是在调用函数前先把$(this)存入变量，然后再在回调函数中使用就没问题了，在这作一下笔记。$(document).ready(function(){$(“.del”).click(function(){obj=$(this).parent();//回调函数前先写入变量;delid=$(this).attr(‘delid’);$.get(‘drag.php’,{‘op’:‘de... 继续阅读 >
2014
11-11

Web 开发者必备的 14 个 JavaScript 音频库

网页设计可能是现在最有趣的领域之一了。这块的东西对所有的人，不管是知识储备里有料没料的，都敞开大门，机会多多。 其最大的特点就是随着时间的推移，实践的深入，你可以慢慢学习着成为一个大鸟。 涉足这个领域，Google将会是你最好的导师，同时她也将毫无偏颇的对你的水平进行评价。设计并不全是铁定的要为应用程序的创建或者编程语言的一些逻辑应用进行大量的编码工作。她更像是创造力同逻辑代码的结合，从而可以使您开发出... 继续阅读 >
2014
11-11

如何用PhotoShop制作网站的favicon.ico

所谓favicon，即FavoritesIcon的缩写，顾名思义，便是其可以让浏览器的收藏夹中除显示相应的标题外，还以图标的方式区别不同的网站。当然，这不仅仅是Favicon的全部，根据浏览器的不同，Favicon显示也有所区别：在大多数主流浏览器如FireFox和InternetExplorer(5.5及以上版本)中，favicon不仅在收藏夹中显示，还会同时出现在地址栏上，这时用户可以拖曳favicon到桌面以建立到网站的快捷方式；除此之外，标签式浏览器甚至还有不... 继续阅读 >
2014
11-11

关于浮动（float）的最优清除方案推荐

对于日新月异的WEB开发技术和浏览器更新频率来说，清除浮动已然是一个被人嚼碎了的话题。说是这些年过去了，有关float的地方，还依然少不了清除浮动的标签和css代码。W3C整天研究html5，就不能抽出点时间来把这种烦人的小细节修正一下吗？抱怨归抱怨，饭还得吃，钱还得挣，清除浮动就不能停止。为了清除浮动增加无语义代码已经是最稳定和简单的方式，但总叫开发者心里感到不舒服，毕竟这么多年来早已习惯了结构和样式的分离，非要... 继续阅读 >
2014
11-11

一个不错的JavaScript解析浏览器路径方法

JavaScript中有时需要用到当前的请求路径等涉及到url的情况,正常情况下我们可以使用location对象来获取我们需要的信息,本文从另外一个途径来解决这个问题,而且更加巧妙方法如下：functionparseURL(url){vara=document.createElement('a');//创建一个链接a.href=url;return{source:url,protocol:a.protocol.replace(':',''),host:a.hostname,port:a.port,qu... 继续阅读 >
2014
11-11

JSON资料搜集整理大全

1.什么是JSONJSON(JavaScriptObjectNotation)是一种轻量级的数据交换格式。它基于JavaScript的一个子集。JSON采用完全独立于语言的文本格式，但是也使用了类似于C语言家族的习惯（包括C,C++,C#,Java,JavaScript,Perl,Python等）。这些特性使JSON成为理想的数据交换语言。易于人阅读和编写，同时也易于机器解析和生成。2.JSON语法规则JSON 语法是JavaScript 对象表示法语法的子集。l 数据在名称/值对中l 数据... 继续阅读 >
2014
11-11

配置SyntaxHighlighter的Autoloader（自动加载）

因为使用SyntaxHighlighter的时候会使用到多种语言，一次必载入全部的语言配置文件下载的东西会比较多，所以SyntaxHighlighter提供了一个shAutoloader.js脚本。官方给出的例子如下:functionpath(){varargs=arguments,result=[];for(vari=0;i<args.length;i++)result.push(args[i].replace('@','/pub/sh/current/scripts/'));returnresult};SyntaxHighlighter.autoloader.apply(null,pat... 继续阅读 >
2014
11-11

关于CSS浮动(float,clear)的通俗讲解

写在前面的话：由于CSS内容比较多，小菜没有精力从头到尾讲一遍，只能有针对性的讲解。如果读者理解CSS盒子模型，但对于浮动不理解，那么这篇文章可以帮助你。小菜水平有限，本文仅仅是入门教程，不当之处请谅解！本文以div元素布局为例。教程开始：首先要知道，div是块级元素，在页面中独占一行，自上而下排列，也就是传说中的流。如下图：可以看出，即使div1的宽度很小，页面中一行可以容下div1和div2，div2也不会排在di... 继续阅读 >
2014
11-11

flappy bird游戏源代码揭秘和下载 —— 可运行于android、ios和html5多平台

背景：最近火爆全球的游戏flappybird让笔者叹为观止，于是花了一天的时间山寨了一个一模一样的游戏，现在把游戏的思路和源码分享出来，代码是基于javascript语言，cocos2d-x游戏引擎，cocos2d-xeditor手游开发工具完成的，请读者轻砸；ps：运行demo必须配置好cocos2d-xeditor，暂不支持其他工具。还有demo是跨平台的，可移植运行android，ios，html5移动系统等；AndroidApk下载：（演示效果）暂时只移植打包到android系统... 继续阅读 >
2014
11-11

如何在电脑上测试手机网站（一）—— Chrome 篇

chrome模拟手机总共有四种方法，原理都一样，通过伪装User-Agent，将浏览器模拟成Android设备。以下标星的为推荐方法。1.新建Chrome快捷方式右击桌面上的Chrome浏览器图标，在弹出的右键菜单中选择“复制”，复制一个图标副本到桌面。右击该副本，选择“属性”，打开相应的对话框，在“目标”文本框的字符后面添加以下语句：“–user-agent=”Android””，如下图：意user前面是两个“-”，并且“chrome.exe”与“–user”之间... 继续阅读 >
2014
11-11

如何在电脑上测试手机网站（二）—— Firefox 篇

1.修改user-agent和chrome一样安装插件修改user-agent的方法（参考上一篇文章：如何在电脑上测试手机网站（一）——Chrome篇）1）下载firefox。点击菜单，工具-〉附加组件-〉获取附加组件。2）查询安装三个组件：wmlbrowser、XHTMLMobileProfile以及UserAgentSwitcherwmlbrowser、XHTMLMobileProfile是用来兼容解析WAP网页格式的组件。UserAgentSwitcher是模拟UserAgent(UA)的组件，就是让浏览器假装成手机UA头... 继续阅读 >