随笔分类 - 前端技术
摘要：首先，感谢你为我的这篇文章点了推荐，虽然你可能没有点，但是我已经“好心”的帮你点了。不信？那你先看下文章右下角的推荐数，然后刷新下页面看看。 下面我来说下实现原理，其实没什么技术含量，懂点js的人都能进行操作。 我先用firebug查看了页面上推荐按钮的DOM，发现其实是个点击事件： 是一个叫 DiggIt() 的方法，分别传入了3个参数，看参数命名应该分别是文章ID、博客ID和一个写死的1。这下就简单了，是不是我直接在页面底部写句一模一样的方法，就能实现了呢？ 于是我到后台“设置”里面找到页尾输入筐，调用这个方法，如下： 欣喜的去测试，发现测试失败，在我更新后台设置后，再去看，...
阅读全文
摘要：中秋了，一个团圆的日子，结果从杭州回到老家，发现家里的狗没了，一问才得知是去世了，虽然一共加起来没见过几次，但还是挺难过的。发一张照片留作纪念吧。 下面进入正题吧，前几天由于工作需要制作一个分享按钮，考虑到后续其他项目可能也会用到，于是就打算写成插件化，正好也给我自己的插件jquery.hooray增加一个新的功能，为了不浪费大家时间，我先把demo放出来，如果觉得能用到，或者想学是怎么制作的，那就继续往下看。（demo演示） 既然要做成插件，那可制定性肯定要强，不能定死，比如不能把显示个数定死，不能把分享按钮排序定死等等（不过有些东西还是要定死的，太灵活了也就成不了插件了）。这里我的...
阅读全文
摘要：上一周我说到，我要开始做一个仿桌面系统的CMS。现在，一周过去了，来做个小小的总结吧，顺便把上一周片尾留的小问题解答下。桌面 关于界面，思前想后，还是模仿115的了，说是模仿，其实几乎是照搬。因为我看了下HTML和CSS，没有什么太大的技术含量，制作起来也不会遇到什么困难，干脆舍弃这一步，进入后面的话题。 上周我留下了一个问题，就是桌面那一个个快捷方式，为什么不能直接写在页面里，而要通过js来加载。其实，并非一定要通过js加载生成，但是即便写在页面里，也还是通过js来定位，对，就是定位。试想一下，浏览器的窗口有大有小，如果直接写在页面里固定死，那窗口缩小了，岂不是要把有的图标给遮住了。...
阅读全文
摘要：开篇 一个月前，我突然有了个想法，CMS能否做的像webQQ那样，整个后台就像一个桌面系统，把功能归类到一个桌面图标里，点开某个图标后，操作里面的东西，就像在操作电脑上的某个文件夹一样简便，于是我之前写了一篇构想的文章：《关于CMS后台展示/操作方式的个人拙见》，不过认可我想法的人似乎不多。 当时发表完文章后，我也在想，这样的方式是否真的适用于CMS，我和几个同事，以及公司老总都讨论过。有人也提到开发成本的问题，我说这个不是问题，现在不用公司花人力去专门开发，我先做个雏形，把一些调用方法都封装好，比如窗口操作（最大化、最小化、关闭）、右键操作等一些公用的操作，写成一个类，之后如果可行，再继..
阅读全文
摘要：4.1.1下载地址：点击进入 希望作者maodong能尽快处理好以下几个问题，期待稳定版的发布，闲话不多说，下面开始问题汇总： 一、未压缩版和压缩版不一样 解决办法：压缩版的问题似乎比较多，由于看不到压缩版的实际源码，也做不了修改，所以暂时使用未压缩版，或者也可以把修改好的未压缩版，自己去压缩一下再使用。 二、ajaxValidator方法提示方式强制弹框 代码片段： 解决办法，阅读能力有限，暂时只能将alert那句代码注视掉。 三、ajaxvalidator验证通过后，再获得焦点再失去焦点，tip提示就体质停留在onWait状态 代码片段： 解决办法：当输入框内的值没变动，也强制让他进行一.
阅读全文
摘要：之前发现的一个小软件，并且也已经在具体项目中使用了，比如一些网页按钮效果，因为基本不会更改，就直接生成base64位编码写在css样式文件里了。 软件界面如下： 应用如下：background:url(data:image/png;base64,iVBORw0KG...kSuQmCC) 下载地址：点击下载
阅读全文
摘要：虽然自己也写过插件，但JQuery插件种类的繁多，大多时候，我还是使用别人写好的插件，这些都是我用了同类插件里较为不错的一些，今天就整理一下公开放出来。 UI： jquery.HooRay（哈哈，自己写的插件是必须有的） jquery UI（官方的UI插件，功能很多，但我只用少数几个） jQuery EasyUI jQuery LigerUI 对话框： artDialog（很欣赏这个插件，又强大又美观） AsyncBox（制作者小吴同学也是博客园的人呢） jBox（继续国人的插件，就是皮肤稍微做的弱了点，功能上一点不输前两者） lhgDialog（作者似乎和我同龄，挺不...
阅读全文
摘要：前几天发了篇《借助Google Translate API实现网站多国语言翻译功能》，但好心人告诉我，谷歌即将关闭一些API，其中就包括谷歌翻译的API，以下是原文：最近Google宣布将关闭一批API，被称为“春季大扫除”，其中包括了Translate API(12月1日彻底关闭)──无数开发者都在利用它打造丰富的翻译类第三方应用。Google对此的解释是说这些API给Google带来了巨大的经济负担，且存在大量的滥用行为。 基于这种情况，我于是着手开始找其他实现办法，找了百度、搜狗、金山、有道，发现国内这些做翻译的，都没有一个成型的、对外的接口。无奈之余，想起了Bing，找了下，还真有开.
阅读全文
摘要：功能很简单，之前在做项目时用到的，现在分享出来。先看下效果吧： 中文 | 英文电锯惊魂2、3、4导演达伦斯·鲍斯曼的新片《母亲节》已经出下载了，此片翻拍1980年的恐怖片经典《Mother's Day》，由《推动摇篮的手》演技派女星蕾贝嘉·狄摩妮携手《3D血腥情人节》洁米金、《舞力全开》布莉安娜·艾维根、《噬血真爱》黛博拉安华尔及《X战警》尚恩·艾希摩（Shawn Ashmore）…等新生代帅哥美女偶像演出。 代码如下，首先我们要引用3个JS文件，分别是jquery-1.6.min.js、jquery.translate-1.4.7.min.js
阅读全文
摘要：废话不多说，先看一下下面这段代码：<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>IE6 position:fixed bug</title><style>*{padding:0;margin:0}p{height:2000px}#gs{border:1px solid #000;position:fixed;rig
阅读全文
摘要：不知道大家有没有注意到谷歌今天官网上的logo，刚开始一看还以为是gif，在仔细一看，发现并非如此，原来是使用CSS Sprite技术，利用一个初始图片和一张画满各个动作的拼接图片，从而实现了动画效果。 本人一时手痒，就想把这个扒下来，但发现谷歌的js写的太牛逼了，无奈，只能自己用自己的思维去模拟一个了。首先，需要两张图，分别是： 当有这两张图后，我们就可以开始模拟了。 我先通过firebu...
阅读全文
摘要：HTML5增加了更多语义化的标签，如header，footer，nav……让我们在页面编写的时候，不需要再用下面这种方法去布局了： 而可以用这样的方式去布局： 但是IE不向前支持，所以我们想让它支持IE6,7,8需要在js和css里增加一点小代码，如下： css： 以上的意思就是自定义一个标签为header并将其设为块状显示，下面附上完整代码吧： 接着说些无关的吧，为什么要语义化去写ht...
阅读全文
摘要：jquery提供了$.getJSON的方法，让我们可以实现跨域ajax请求，但jqueryAPI上的内容实在太少，如何用$.getJSON，请求网站应该返回怎样的数据库才能让$.getJSON获取到，下面我就用一个实际例子来说明下。（主要是留个备用，怕以后再用到自己却忘记了，所以没有太多的解释，实在看不明白的话，照着我的代码，你也试一个吧） 我后端是用php的，以下代码主要实现的一个功能就是提供一个预约登记的接口，需要传入的数据分别有：用户姓名、联系电话和地址....../*预约登记 执行 接口*/case "yuyue_interface": $name = trim($
阅读全文
摘要：相信上面两张图片上的输入框里有提示信息这功能大家都见过，有的人应该也自己动手做过。 我之前也做过，做法应该和大家都差不多，在输入框里写入提示内容，当鼠标获取焦点后清空内容，当失去焦点后判断内容是否为空，如果为空，则恢复显示提示内容，反则不显示。但这样的做法是否合理？下面一一来做下分析。 1、如果输入内容和提示内容完全一样，当失去焦点后，应该如何判断？ 2、如果input在表单里，提交表单后，提示信息随着表单一并提交，难道还要在后端判断提交信息不等于提示信息，再进行数据操作么？ 3、如果1、2两条都触发，后端要如果操作？ 既然这种做法缺点这么多，那怎么做更好呢？其实方法很简单，把提示信息单独写.
阅读全文
摘要：这不是一个新东西，但它确实是个好东西。只能说我OUT了，这小插件还是在别人博客上一年前的日志里看到的，先来个链接吧，写的已经很详细了，我这里只是给自己做个记录，留给自己看的。（Zen Coding: 一种快速编写HTML/CSS代码的方法） 那Zen Coding到底是什么，又是如何使用的呢？我们看一下官方举的例子吧，如果你输入： 就会看到这样的输出： 有点看不懂了吧？那我们再来看个视频，不...
阅读全文
摘要：之前对“在网页中嵌入非系统自带字体”做过一点研究，虽然技术上能实现，但是对国内来说，没有太大的实际意义，因为一个中文体文件起码20M+，而且各个浏览器支持的字体文件还都不一样，也就是说，在服务器端必须有2-3个不同格式的字体文件，用来应付各个浏览器，可以看下下面这张对应图。 以为之前做的这个小研究对以后的工作不会用到，谁知还真的用到了。有个客户要求显示时间，但时间的字体必须是电子表的那种字体，如图： 首先，我们要找到这个字体，因为这个字体只有ttf格式的，所以我们需要转换出其他各种不同的格式，至于如何转换，有软件，有在线，我在这就不指明一定要使用哪种了。 转换好后，就可以编写css代码了@f.
阅读全文
摘要：淘宝曾做出调查，大约有0.1%的淘宝用户在访问淘宝网的时候是警用js脚本的，虽然看似比例不大，但假设淘宝网每天有1000万人访问，那也有1万人是无法正常浏览淘宝网的，一个大型的网站是绝对不允许出现这样的问题的，所以淘宝在这块做的很好，怎么个好？让我们用IE8来测试下（当然前提是在Internet选项里把js脚本都禁用起） 然后访问，我们发现出现了一个提示页面，提示用户是否继续访问，或者进入另外一个页面查看解决办法。 有了这么一个页面，是否觉得操作上更加友好了？那这功能要如何实现呢，其实代码相当简单：<!--[if lte IE 8]><noscript><styl
阅读全文
摘要：先来两张预览图，测试浏览器为搜狗浏览器。使用方法：1、右键点击我，把我添加早收藏夹2、在任意页面点击刚才添加的收藏，然后等一会，就会在页面右下角看到一个firebug的小按钮，然后点击它即可。附：如果你想让页面默认就有一个firebug的小按钮进行调试，那直接加一句：<head>...<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>...</head>虽然现在能在IE是使用fb了，但是I
阅读全文
摘要：本插件基本算原创，其中大多数功能是在之前工作中发现经常会使用到的，但使用他人的插件放一起用会出现冲突，或者某个插件不能兼容各个浏览器，于是本人对一些插件进行修改或重写，也有些优秀的插件原封不动的整合进来，但由于插件开源共享，所以没有写明插件的来源地址以及作者信息，望见谅。 该插件最大的优势就是不会和其他开源jquery插件产生冲突，每一个方法产生的html元素的样式名或者id都是带私有前缀的，所以不用担心样式上会冲突。 由于没有设计感，所以没有特别为这个插件写API页面，至于使用方法、参数说明以及注意事项都写在jquery.HooRay.js这个JS里。如果你是第一次使用该插件，建议你...
阅读全文