Translate This Button 在线翻译按钮

08月 25th, 2010

翻译成52种语言的按钮：

只需复制并粘贴您网站上的任何地方TranslateThis按钮，它的自由和方便。有没有文件上传和它在几乎所有网站的作品。

该TranslateThis按钮是一个轻量级的Javascript翻译工具 。它翻译成任何页面快速使用Ajax和谷歌语言的API。

只不过Google在国内访问时断时续不是太稳定

jQuery自定义动画animate的一些使用心得

08月 24th, 2010

今天在工作中遇到了表单验证时提醒的动画效果，效果很简单：如果必填表单为空则此表单项的边框会闪烁几下并最终为红色。
如果只是简单的input和textarea元素的话，很简单，直接设置其边框颜色即可。
可是如果是select元素的话，在IE6/7中元素的边框色是不起作用的，于是想到了在其外面套上一个内联元素，动画操作此内联元素即可。

思路如下：
1. 一个专门接口的函数，其参数为表单元素对象；
2. 利用jQuery的animate方法来自定义动画效果：设置其border属性；
3. 监听需要验证时的事件：当前元素失去焦点时、表单提交时；

思路屡清楚之后开始行动：
1. 接口函数：

function checkForm(d){
	var isIE= !jQuery.support.cssFloat;
//	var _dom=isIE?jQuery(d).parent():jQuery(d);
if(isIE){
	jQuery(d).wrap('span');
	_dom=jQuery(d).parent('span');
}else{
	_dom=jQuery(d);
}

	if (d.value =='') {
		_dom.addClass('checkform-error');
		 _dom.animate({border: '1px red solid'}, 100)
			.animate({border: '1px white solid'}, 100)
			.animate({border: '1px red solid'}, 100)
			.animate({border: '1px white solid'}, 100)
			.animate({border: '1px red solid'}, 100);
	}else{
		_dom.removeClass('checkform-error').removeAttr('style');
	}
}

经过测试，FF(火狐)下没任何问题，边框啥的都可以闪烁，但到了IE下问题就来了。
首先是IE下jQeury的animate中不能直接设置border样式的属性，提示“参数错误”，经过网上一顿乱找后仍然没有解决。
于是换成 .animate({borderColor:’red’}) 再试试吧，结果还是不行，测试了几次之后发现IE下面只有borderWidth是可以用的。
没办法只能继续想起他的办法……

在网上查了下animate里面可以用到的属性中可以包括：

$().animate(
        {
               left: 100,
               style: 'margin: 10px;',
               className: 'checkWrap',
               opacity: 0.5,
               backgroundColor: 'yellow',
               borderWidth:'1'
        },

而且IE下还有个问题就是$().unwrap();不起作用，于是之前的想法就不成立了，继续想……

< 未完.待续…… >