作者存档: hhdem

35个复古类型免费的英文字体

Sandwich

Titania

Kelvinized

Secesja

Studebaker

Ballpark

Stony Island

Minotaur

Hamburger Heaven

Forty Second Street

Campanile

Louisianne

Minstrel Poster

Sesame

Tall Deco

East Market

Carnivalee Freakshow

Diner Regular

Circus Ornate

Day Poster Black

Showboat

Chi-Town

Nashville

Fletcher Gothic

Matchbook Typefaces

Mailart Rubberstamp

Bazar Medium

20db

Airstream

Seaside Resort

Parisian

Bobel

Fusty Saddle

Brandon Grotesque

16个CSS3和jQuery加载动画

spin.js

CSS3 Loading Animation Loop

CSS3 Loading Animation

CanvasLoader Creator

Flickr Style Loading Animation Using JQuery

CSS Loading Animation Circle Style

Loading CSS spinners and bars generator for AJAX & JQuery

Ajax Style Loading Animation in CSS3 (no Images)

CSS3 loading spinners without images

Bouncy Animated Loading Animation

Sonic – looping loaders

Simple Loading Modal

PageLoading – jQuery plugin

Image Loader (jQuery Plugin)

Simple Content Loader

Preloadify

10个免费的css编辑器收集

Notepad++

editor PSPad

Stylizer – Real-Time CSS Editing

TopStyle 4 for Windows

Xyle scope

Rapid CSS Editor

The Web Editor

EngInSite CSS Editor

Arduo Css Editor

Simple CSS — A Free CSS Authoring Tool

[记录] Spring3 MVC中Ajax的使用

现在已经开始使用Spring3了,MVC虽然用了很久不过Ajax一直通过DWR实现,不过既然Spring3已经支持Ajax访问,那就必须折腾下了。

1. 首先,新建Controller类用于接收ajax请求,这里建立AjaxCheckController,目的是检查注册用户是否已经存在

@Controller
@RequestMapping("/a")
public class AjaxCheckController extends BaseController {

	@Autowired
	private UserManager userManager;

	@RequestMapping(value = "/checkexists/loginname/{loginName}", method = RequestMethod.GET)
	public @ResponseBody Map<String, Object> checkLoginNameExists(@PathVariable String loginName) {
		User user = userManager.findUserByLoginName(loginName);
		Map<String, Object> modelMap = new HashMap<String, Object>();
		modelMap.put("exists", user != null);
		return modelMap;
	}

	@RequestMapping(value = "/checkexists/email", method = RequestMethod.GET)
	public @ResponseBody Map<String, Object> checkEmailExists(@RequestParam(value = "email", required = true) String email) {
		User user = userManager.findUserByEmail(email);
		Map<String, Object> modelMap = new HashMap<String, Object>();
		modelMap.put("exists", user != null);
		return modelMap;
	}

}

2. 请求页面,在这里就是注册页面了,部分js代码如下:

function loginOnChange(event) {
	        	....
		        	$.ajax({
				        type : 'GET',
				        contentType : 'application/json',
				        url : 'a/checkexists/loginname/'+loginname,
				        dataType : 'json',
				        success : function(data) {
					          if (data && data.exists) {
						        log_tip_div.style.display = "inline";
								log_tip.innerHTML="<img src='<@common.basePath/>/img/exclamation.gif'/> 该用户名已经被使用";
								canSub = false;
								loginUserError = true;
								isLoginUserExists = true;
					          }else {
								log_tip_div.style.display = "inline";
								log_tip.innerHTML="<img src='<@common.basePath/>/img/fit.gif'/> 用户名可以使用";
								canSub = true;
								loginUserError = false;
								isLoginUserExists = true;
							  }
				        },
				        error : function() {
				          alert("error")
				        }
			    	});

				.....
	        }

	        function emailOnChange(event) {
	        	....
	        		$.ajax({
				        type : 'GET',
				        contentType : 'application/json',
				        url : 'a/checkexists/email',
				        data: 'email='+email,
				        dataType : 'json',
				        success : function(data) {
							if (data && data.exists) {
								email_tip_div.style.display = "inline";
								email_tip.innerHTML="<img src='<@common.basePath/>/img/exclamation.gif'/> 该邮箱已经注册过";
								canSub = false;
								emailError = true;
								isEmailExists = true;
							} else {
								email_tip_div.style.display = "inline";
								email_tip.innerHTML="<img src='<@common.basePath/>/img/fit.gif'/> 邮箱未被注册过,可以使用";
								canSub = true;
								emailError = false;
								isEmailExists = true
							}
						},
				        error : function() {
				          alert("error")
				        }
			    	});
				....
	        }

到此就可以了,可以通过jquery轻松访问Spring的Controller,是不是很简单呀!

Spring+Freemarker的自定义标签 实现标签给定时间与当前时间对比

下面的三步为Spring + Freemarker组合添加自定义标签:compareTime
compareTime标签的目的是比较传入的日期对象与系统当前日期,返回特定字符串。这里并没最格式化日期的操作,如果仅需要对比到天可以格式化下日期。
1. 修改Spring配置文件:

<bean id="freemarkerConfigurer" class="org.springframework.web.servlet.view.freemarker.FreeMarkerConfigurer">
        <property name="templateLoaderPath" value="WEB-INF/templates/"/>
        <property name="freemarkerSettings">
            <props>
                <prop key="datetime_format">yyyy-MM-dd HH:mm</prop>
                <prop key="default_encoding">UTF-8</prop>
                <prop key="date_format">yyyy-MM-dd</prop>
                <prop key="number_format">0.##########</prop>
            </props>
        </property>
        <property name="freemarkerVariables">
            <map>
                <entry key="xml_escape" value-ref="fmXmlEscape"/>
                <entry key="compareTime" value-ref="compareTime"/>
            </map>
        </property>
    </bean>
...
<bean id="compareTime" class="com.hhdem.sample.utils.freemarker.CompareTime"></bean>

2. 添加CompareTime类,实现TemplateDirectiveModel接口

package com.hhdem.sample.utils.freemarker;

import java.io.IOException;
import java.util.Date;
import java.util.Map;

import freemarker.core.Environment;
import freemarker.template.SimpleDate;
import freemarker.template.TemplateDirectiveBody;
import freemarker.template.TemplateDirectiveModel;
import freemarker.template.TemplateException;
import freemarker.template.TemplateModel;

/**
 * @since 2012-1-9,下午05:16:53
 * @author <a href="mailto:liubingchina@gmail.com">hhdem</a>
 * @version $Id$
 * @comment
 *
 */
public class CompareTime implements TemplateDirectiveModel{

	@Override
    public void execute(Environment env, Map params, TemplateModel[] loopVars,
            TemplateDirectiveBody body) throws TemplateException, IOException {
		Date date = new Date();
		String showStr = "";
		try {
			SimpleDate cdate = (SimpleDate) params.get("cdate");

			if(date.compareTo(cdate.getAsDate()) == 0) {
				showStr = params.get("eStr").toString();
			} else if (date.compareTo(cdate.getAsDate()) > 0) {
				showStr = params.get("lStr").toString();	// 未来
			} else if (date.compareTo(cdate.getAsDate()) < 0) {
				showStr = params.get("fStr").toString();	// 过去
			}
			env.getOut().write(showStr);
		} catch (RuntimeException e) {
        	env.getOut().write(showStr);
        }
    }
}

3. freemarker模板中直接通过下面代码调用即可

<@compareTime cdate=s.startDate lStr='已经过期' fStr='尚未过期'/>
第 1 / 9 页123456789