Willin Wang » 开发Develop

Additional Learning on website2论文

长岛冰泪 — Sat, 19 Jun 2010 15:15:19 +0000

（节选）

xHtml instance with jQuery: Willin-Page

Description

WillinPage说明

简介：

WillinPage是一个简单的静态网站，介绍了Willin OR Guy（长岛冰泪个人博客）和Willin Studio。

整站共7个静态页面，符合W3C xhtml 1.0规范，加入了CSS3元素（IE只支持到CSS 2.1）。运用jQuery代码实现了整站AJAX。

演示截图

在线演示：DEMO

说明：

IE下需要允许脚本或ActiveX控件。
顶部导航栏红色表示当前的页面，点击无效。
因为IE6下，自动切换jQuery效果不如Flash，但是网上仍有近30%的人在使用IE6，所以首页幻灯设置为鼠标滑过切换。放弃IE这个世界该会多么美好。IE下会显示抱怨信息，点击后隐藏。

下载地址：源代码 / 备用地址

Core Codex

Ajax Module Code of jQuery:

//全局Ajax函数

$("#loading").ajaxStart(function(){
 
$(this).fadeIn('fast');
 
$('#ajaxpost').hide(0);
 
});
 
$("#loading").ajaxStart(function(){
 
$(this).fadeOut(100);
 
$('#ajaxpost').fadeIn(1000);
 
});
 
$('.homelink').click(function(){
 
if($(this).parent('li').is('.current_page_item')) return false;
 
$.ajax({
 
url: "html/home.html",
 
cache: false,
 
success: function(msg){
 
$("#ajaxpost").html(msg);
 
$.getScript("js/willin-tab.js");
 
}});
 
$('li.current_page_item').removeClass('current_page_item');
 
$('.homelink').parent('li').addClass('current_page_item');
 
return false;
 
});

CSS of Willin-Tab:

#msgbox ul{padding-left:5px}
 
#msgbox-left{border:1px dashed #ccf; display:block; float:left; height:205px; overflow:hidden; position:relative; width:33%}
 
#msgbox-right{border:1px dashed #ccf; display:block; float:right; height:205px; overflow:hidden; position:relative; width:66%}
 
#msgtabup,#msgtabdown{padding:1px; width:100%}
 
#msgtabdown{bottom:0; float:right; position:absolute; right:0; width:auto; z-index:999}
 
#msgtabdown img{border:0; margin-right:5px}
 
#msgtabdown img.current{border:1px dashed #f06!important; color:#f06}
 
#msgspan{bottom:24px; color:#f06; display:inline-block; height:20px; position:absolute; right:5px; z-index:999; background:#fff; opacity:0.8}
 
.msgtab{display:none; width:99%}
 
.msgtab span{color:#099; font-style:italic}
 
.msgtab li{background:url(img/lim.gif) no-repeat center left; padding-left:15px !important; margin-top:3px !important; font-size:12px !important;}
 
#msgbox-left li { padding-left:15px !important; margin-top:5px !important; background: url(img/lil.gif) no-repeat center left !important;}
 
.msgtitle{border-bottom:1px dashed #ccf; color:#f06; padding-left:5px; vertical-align:middle; width:100%}
 
.msgtitle img{cursor:pointer; margin-right:5px; vertical-align:middle}

Willin-Tab of jQuery:

jQuery(document).ready(function($){
 
$('.msgtab:first').css('display','block');
 
$('#msgtabs-1').addClass('current');
 
$('#msgspan').text($('#msgtabs-1').attr('alt'));
 
var i=0;
 
function slide(i){
 
$('#msgtabdown img').removeClass('current');
 
$('#msgtabs-'+i).addClass('current');
 
$('#msgspan').text($('#msgtabs-'+i).attr('alt'));
 
$('.msgtab').stop(true,true).slideUp();
 
$('#msgtab-'+i).stop(true,true).slideDown();
 
}
 
$('#msgtabdown img').hover(
 
function () {
 
i = $(this).prevAll().length+1;
 
slide(i);
 
},function () {
 
}
 
);
 
});

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

作者：长岛冰泪，网址：http://www.willin.org/
原文标题：Additional Learning on website2论文
原文链接：http://www.willin.org/develop/niit/add-onweb2/
(C) 长岛冰泪版权所有，转载时必须以链接形式注明作者和原始出处及本声明。

Willin-G情侣WP博客主题1.1 BETA发布

长岛冰泪 — Sat, 22 May 2010 02:22:19 +0000

主题说明：

Wordpress情侣博客主题，长岛冰泪原创。主要适合情侣用。（单人博客或多人博客也适用。）

简单的jQuery框架。IE6下基本显示完美（尽了最大的努力了，比如用了 CSS fixed插件）。

符合xhtml 1.0和CSS 3规范。

调试环境：

屏幕：1024*768、1280*800、1366*768
浏览器：IE 6（XP）、FireFox 3.6.4（推荐）、Google Chrome 5.0、Safari 4
系统：Wordpress 3.0 beta 2、Wordpress 2.9.2

有主题后台（目前只有摘要相关的选项，不断完善中）。

内置插件：

utf8-excerpt（显示摘要，作者：水煮鱼）
wp-commentnavi（评论分页）
wp-pagenavi（文章分页）
smiley（添加表情）
Add an image in a comment（评论添加图片）
ajax-comment（AJAX评论，作者：Willin Kan）
mail-to-commentors（评论邮件回复）

下载：Willin-G_Beta (5.22更新，请下载最新版本V1.1.2)

演示：Demo Page （请记住：demo.willin.org）

http://i.willin.org/?wptheme=Willin-G

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

作者：长岛冰泪，网址：http://www.willin.org/
原文标题：Willin-G情侣WP博客主题1.1 BETA发布
原文链接：http://www.willin.org/develop/wordpress/willin-g-preview/
(C) 长岛冰泪版权所有，转载时必须以链接形式注明作者和原始出处及本声明。

国内的免费主机可以用吗?

长岛冰泪 — Wed, 19 May 2010 00:45:41 +0000

今天有一位热心网友在我博客里留言问：demo.willin.org挂马了？

在这里我解释一下，这事情不是我所齿的。

刚才我上课的时候用学校机子看了一下，确实挂了马了，对于这个问题，我作了一些猜测（省略吧，不然说我诋毁人）。

demo.willin.org 用的是zhujiwu的免费主机（验证时候还上传了身份证和生活照，感觉还是比较正规的。至少国内的免费主机大家都经常推荐这个。）

前一段时间修改新模板上传的时候，发现FireBug提示有多处html错误，查看源代码时候发现在文档头部（html之前）和文档尾部（body之后）都出现了空的script语句，修改模板后发现找不到这处错误。当时我以为是我电脑的问题，所以没太在意。

没有想到，现在直接跳木马了。至于这是什么原因，我想我不用多说，大家意会下吧。

过段时间，我回再找一个合适的主机把demo.willin.org转移过去，请大家暂时先不要访问了。

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

作者：长岛冰泪，网址：http://www.willin.org/
原文标题：国内的免费主机可以用吗?
原文链接：http://www.willin.org/develop/blog/whether-free-in-cn/
(C) 长岛冰泪版权所有，转载时必须以链接形式注明作者和原始出处及本声明。

Willin-Mood_Pro v2.0.6主题发布

长岛冰泪 — Mon, 17 May 2010 09:12:33 +0000

First of all, this Theme is also available in English, please see:

Wordpress Theme:Willin-Mood_Pro v2.0.6 Release

Willin-Mood的第一个版本很失败，是在分辨率为1280×800的宽屏机器下做的。这次注意了分辨率的问题，并且在IE 6下进行了测试。

目前已经实现了简单的AJAX，下一步将要实现整站AJAX。

经过反复测试，目前符合xhtml 1.1 和 css 3 的规范了。

所以我迫不及待地就将它拿出来测试，欢迎大家纠错。

已经向Wordpress官方提交。

介绍：

这是我做的第一个主题(升级版本)。有一些想法是从别的主题上拽下来的。没有太多自己的东西。但代码基本都是自己写出来的。

喜欢的朋友们就支持一下吧，我会不断更新它的，比如融入AJAX。

版本需求：

2.3或者更高（测试到3.0 beta2）

目前特色：

首页AJAX化
AJAX评论
首页和子页显示不同的边栏
边栏Slide Tabs
整合PageNav
顶部导航N级菜单（理论上无限）
SEO优化
部分jQuery特效

特色预告：

更多jQuery特效
添加后台
整站AJAX
支持更多Plug-ins

演示：

Demo page

下载地址：

V2.0.6（正式版）/V2.0.2（整站AJAX Beta）

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

作者：长岛冰泪，网址：http://www.willin.org/
原文标题：Willin-Mood_Pro v2.0.6主题发布
原文链接：http://www.willin.org/develop/wordpress/willin-mood-pro/
(C) 长岛冰泪版权所有，转载时必须以链接形式注明作者和原始出处及本声明。

Willin-Mood_Pro V2即将发布

长岛冰泪 — Fri, 14 May 2010 17:37:54 +0000

Willin-Mood的第一个版本很失败，是在分辨率为1280×800的宽屏机器下做的。这次注意了分辨率的问题，并且在IE 6下进行了测试。

目前已经实现了简单的AJAX，下一步将要实现整站AJAX。

经过反复测试，目前符合xhtml 1.1 和 css 3 的规范了。

所以我迫不及待地就将它拿出来测试，欢迎大家纠错。

已经向Wordpress官方提交。

目前特色：

首页AJAX化
AJAX评论
首页和子页显示不同的边栏
边栏Slide Tabs
整合PageNav
顶部导航N级菜单（理论上无限）
SEO优化
部分jQuery特效

特色预告：

更多jQuery特效
添加后台
整站AJAX
支持更多Plug-ins

2.0 Beta下载： V2beta.zip

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

作者：长岛冰泪，网址：http://www.willin.org/
原文标题：Willin-Mood_Pro V2即将发布
原文链接：http://www.willin.org/develop/wordpress/willin-mood-pro-preview/
(C) 长岛冰泪版权所有，转载时必须以链接形式注明作者和原始出处及本声明。

长岛冰泪 — Sat, 24 Apr 2010 02:22:26 +0000

先上图，效果可以见首页以及边栏。

会自动切换的选项卡包括两个部分：

首先要有选项卡
其次要会自动切换

先放出边栏Slide Tab的教程。

第一步：HTML下编写Tab框架


	
		相关日志网络身价随机友链
	
	
		
< ?php   wp_related_posts(); }?>
        
		
        Online Earnings [Since Apr, 2010]
     
		
        < ?php wp_list_bookmarks('title_li=&categorize=0&orderby=rand&limit=10'); ?>

第二步：添加CSS

#sidebar-tab{border:1px dashed #ccf;margin-bottom:1.5em;overflow:hidden;}
#sidebar-tab li{overflow:hidden;font-weight:bold;}
#tab-title .current{color:#356aa0;border-bottom:0px;padding:5px 14px;}
#tab-title h4{color:#666;font-size:15px;font-weight:bold;}
#tab-1,#tab-2,#tab-3{padding:5px 9px;border-bottom:1px dashed #ccf;cursor:pointer;width:33%;}
#tab-2{border:1px dashed #ccf;border-top:none;}
#ctab-2,#ctab-3{display:none;}
#tab-content ul{padding:5px 10px;overflow:hidden;list-style:none outside none;}
#tab-content ul li{padding-top:5px;height:20px;}

第三步：添加jQuery代码

	// Slide Tab
	$('#tab-title span').mouseover(function(){ 
	$(this).addClass("current").siblings().removeClass(); 
	$("#c"+$(this).attr("id")).slideDown().siblings().slideUp(); 
});

第二教程：自动切换

可以先看一个例子：Demo
还是需要三步走。

第一步：编写HTML





Test1




Test2




Test3


Tab1Tab2Tab3
Sth

第二步：添加CSS

* {margin:0;padding:0;}
#msgbox-right{display:block;position:relative;width:70%;height:110px;overflow:hidden;}
.msgtab {height:100px;}
#msgtabup,#msgtabdown {margin:1px;width:95%;}
#msgtabdown {width:auto;position:absolute;float:right;right:50px;bottom: 20px;z-index:999;}
#msgtabdown span{margin:5px;}
#msgtabdown span.current{border:1px dashed #f06!important;color:#f06;}
.msgtab {clear:both;width:100%;border:1px dashed #ccf;display:none;}
#msgspan {height:20px;display:inline-block;position:absolute;z-index:999;right:50px; bottom:40px;}

第三步：添加jQuery代码

$(document).ready(function(){
$('.msgtab:first').css('display','block');
autoroll();
hookThumb();
});
var i=0; 
var offset = 2500; 
var timer = null;
function autoroll(){
n = $('#msgtabdown span').length;
i++;
if(i > n){
i = 1;
}
slide(i);
timer = window.setTimeout(autoroll, offset);
}
function slide(i){
$('#msgtabdown span').removeClass('current');
$('#msgtabs-'+i).addClass('current');
$('.msgtab').stop(true,true).slideUp();
$('#msgtab-'+i).stop(true,true).slideDown();
 
}
function hookThumb(){
$('#msgtabdown span').hover(
function () {
if (timer) {
clearTimeout(timer);
i = $(this).prevAll().length+1;
slide(i);
}
},
function () {
 
timer = window.setTimeout(autoroll, offset);
this.blur();
return false;
}
);
}

Demo: Willin-tab

代码基本优化，如果还可以改进，欢迎提出。

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

作者：长岛冰泪，网址：http://www.willin.org/
原文标题：jQuery会自动切换的Tab选项卡Willin-Tab
原文链接：http://www.willin.org/develop/jquery/jq-willin-tab/
(C) 长岛冰泪版权所有，转载时必须以链接形式注明作者和原始出处及本声明。

jQuery下拉导航效果Especially For Willin-Mood

长岛冰泪 — Fri, 23 Apr 2010 04:03:39 +0000

首先，需要对含有二级菜单的元素做CSS定义。（Willin-Mood的Style.css里已经有相应声明，可以跳过此步）

.haschildren {background:url('images/arrow-down.gif') no-repeat right center ;padding-right:15px !important;}
/*添加小箭头*/
.nav li .children { position: absolute; list-style: none; margin: 0 0 0 -7px; padding: 0; z-index: 100; border: 1px solid #DDD; background: #FFF; overflow: hidden; width: 180px ;z-index:999;opacity:0.8;display:none;}
.nav li .children li { float: none; margin: 0; padding: 3px 6px }
/*下拉菜单悬浮显示*/

然后，在js文件里添加：

$('.nav li ul').addClass('children');
$('.nav>li:has(ul)').addClass('haschildren');

这部分代码用来判定含有子菜单的分类，并加上向下箭头。

注意：代码都要加在Ready(function)里

jQuery(document).ready(function($){/*代码*/});

核心代码：

$('.nav li:has(ul)').hover(function(){
		$(this).children('ul:not(:animated)').stop(true,true).slideDown(600);
		},function(){
		$(this).children('ul').stop(true,true).fadeOut(1000);
		});
	$('.children').hover(function(){
			$(this).animate({'opacity':'1'},500);
		},function(){
			$(this).css('opacity','0.8');
		});

此部分代码作用是：当鼠标移动到菜单时子菜单显示，移出则隐藏。

想偷懒？你也可以下载topnav.js（For Willin-Mood）

p.s.不要忘记引入jQuery（Willin-Mood用户就可以忘记了，我记着了，所以引入过了）

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

作者：长岛冰泪，网址：http://www.willin.org/
原文标题：jQuery下拉导航效果Especially For Willin-Mood
原文链接：http://www.willin.org/develop/jquery/jquery-dropdown-nav/
(C) 长岛冰泪版权所有，转载时必须以链接形式注明作者和原始出处及本声明。

Wordpress主题：Willin-Mood V1.0.1发布

长岛冰泪 — Fri, 23 Apr 2010 03:22:33 +0000

ScreenShot

First of all, this Theme is also available in English, please see:

Wordpress Theme:Willin-Mood v1.02 Release

介绍：

这是我做的第一个主题。有一些想法是从别的主题上拽下来的。没有太多自己的东西。但代码基本都是自己写出来的。

喜欢的朋友们就支持一下吧，我会不断更新它的，比如融入AJAX。

版本需求：

2.3或者更高

下载地址：

中文版V1.0.1

英文版V1.0.2 （内容上没有区别）

已经提交WordPress官方，此版本无js，为绿色版。

我正在不断调试jQuery元素，无错后将公布全部特效教程。敬请期待。

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

作者：长岛冰泪，网址：http://www.willin.org/
原文标题：Wordpress主题：Willin-Mood V1.0.1发布
原文链接：http://www.willin.org/develop/wordpress/willin-mood/
(C) 长岛冰泪版权所有，转载时必须以链接形式注明作者和原始出处及本声明。

jQuery美妙的标题提示加强版

长岛冰泪 — Sun, 18 Apr 2010 07:26:45 +0000

灵感来自immmmm：JQuery 学习笔记之：美妙的标题提示

该特效“不但可以让你的 title 提示效果变得美观，而且可以显示出你将要点击的链接的 url，让用户知道自己将要去哪里”，能不能明显提升了用户感受得用户说了算，但我可以肯定的是这绝对能吸引用户的眼球！

jQuery代码，另存为JS或者整合：

	$("a").mouseover(function(e){
	this.myTitle = this.title;
	this.myHref = this.href;
	this.myText = $(this).text().toString().substring(0,4);
	if((this.myTitle=='')&&(this.myText!='http')) this.myTitle=$(this).text();
	this.myHref = (this.myHref.length > 30 ? this.myHref.toString().substring(0,30)+"..." : this.myHref);
	this.title = "";
	$("#tooltip").remove();
	var tooltip = ""+this.myTitle+""+this.myHref+""+"";
	$('body').append(tooltip);
	$('#tooltip').css({"opacity":"0.75","top":(e.pageY-20)+"px","left":(e.pageX+15)+"px"}).show('fast');
	}).mouseout(function(){this.title = this.myTitle;$('#tooltip').remove();
	}).mousemove(function(e){$('#tooltip').css({"top":(e.pageY-20)+"px","left":(e.pageX+15)+"px"});
	});

新版特点：

Title为空、非直接显示http://example.com链接时加入默认提示
修复点击后退页面上会一直显示一个Sweet Titile框的错误
将提示位置移动到鼠标右侧，这样即使链接在底部也能看见提示

CSS代码：

#tooltip {position:absolute;z-index:1000;max-width:250px;word-wrap:break-word;background:#000;text-align:left;padding:5px;min-height:1em;-moz-border-radius:5px;-khtml-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;}
#tooltip p {color:#fff;font:12px 'Microsoft YaHei',Arial,宋体,Tahoma,Sans-Serif;}
#tooltip p em {display:block;margin-top:3px;color:#f60;font-style:normal;}

原版jQuery代码：

jQuery(document).ready(function($){
 
$("a").mouseover(function(e){
	this.myTitle = this.title;
	this.myHref = this.href;
	this.myHref = (this.myHref.length > 30 ? this.myHref.toString().substring(0,30)+"..." : this.myHref);
	this.title = "";
	var tooltip = ""+this.myTitle+""+this.myHref+""+"";
	$('body').append(tooltip);
	$('#tooltip').css({"opacity":"0.8","top":(e.pageY+20)+"px","left":(e.pageX+10)+"px"}).show('fast');
}).mouseout(function(){this.title = this.myTitle;$('#tooltip').remove();
}).mousemove(function(e){$('#tooltip').css({"top":(e.pageY+20)+"px","left":(e.pageX+10)+"px"});
});
});

P.S.不要忘记加载jQuery库

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

作者：长岛冰泪，网址：http://www.willin.org/
原文标题：jQuery美妙的标题提示加强版
原文链接：http://www.willin.org/develop/jquery/jquery-sweet-title/
(C) 长岛冰泪版权所有，转载时必须以链接形式注明作者和原始出处及本声明。

Willin-Mall产品展示WP主题jQuery震撼上线

长岛冰泪 — Sun, 18 Apr 2010 06:04:52 +0000

主题名称：Willin-Mall

WordPress版本：2.9.2（兼容到2.6）

主要脚本：jQuery

xhtml1.0、css3 规范通过

下载地址：willin-mall-beta.zip

官方演示： ishop.wiwill.com

: willin-more 主页图

: xhtml 1.0检测通过

: css3检测通过

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

作者：长岛冰泪，网址：http://www.willin.org/
原文标题：Willin-Mall产品展示WP主题jQuery震撼上线
原文链接：http://www.willin.org/develop/wordpress/willin-mall-beta/
(C) 长岛冰泪版权所有，转载时必须以链接形式注明作者和原始出处及本声明。

Willin-Mall商城jQuery主题预告

长岛冰泪 — Mon, 12 Apr 2010 14:31:07 +0000

xhtml 1.0检测通过

css3检测通过

willin-more 预览图

此主题创意来源于《锋利的jQuery》第八章实例。

现阶段主页已经OK，其他页面正在设计和开发中。

演示地址：ishop.wiwill.com

如果喜欢，就请期待吧~

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

作者：长岛冰泪，网址：http://www.willin.org/
原文标题：Willin-Mall商城jQuery主题预告
原文链接：http://www.willin.org/develop/wordpress/willin-mall-preview/
(C) 长岛冰泪版权所有，转载时必须以链接形式注明作者和原始出处及本声明。

Eclipse 3.6下jQuery自动提示插件

长岛冰泪 — Tue, 06 Apr 2010 14:57:23 +0000

Eclipsecon 2010 即Eclipse V3.6 Helios（太阳神）

依然是用Spket 1.6.18，不过要装的是11.3Mb的那个Jar（必须用这种方式安装）。官方下载地址： Spket IDE

Spket 安装截图

之前用过插件下载、在线更新（即使是官方下载的都没有提示，很奇怪）。

然后可以用破解版的文件覆盖。

点击这里下载：Spket 1.6.18破解版

jQuery提示截图

设置方法

从window->Preferences…进去
如上图选择Spket -> Javascript Profiles
点击New…输入JQuery建立新的profile
点击Add Library，并选择JQuery，建立新的Library
点击Add File, 选择刚JQuery文件。该插件目前只支持到jQuery 1.3.2版本，1.4.2不支持（必须注意，我反复尝试过各个版本才得出，最高支持1.3.2，一般都在用1.2.6）

我估计其他版本现在也差不多是这样设置了。希望我这篇文章能给大家些帮助。
愿天下所有人都能摆脱没有提示jQuery的杯具。

如有其他问题，欢迎留言共同探讨。

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

作者：长岛冰泪，网址：http://www.willin.org/
原文标题：Eclipse 3.6下jQuery自动提示插件
原文链接：http://www.willin.org/develop/jquery/eclipse-jquery-plugin/
(C) 长岛冰泪版权所有，转载时必须以链接形式注明作者和原始出处及本声明。

WordPress插件推荐：回复中插入RSS最新文章CommentLuv

长岛冰泪 — Mon, 05 Apr 2010 13:33:55 +0000

这是在我博客上测试的截图：

一个蛮有意思的小插件，可以在回复时候插入最新更新的日志。CommentLuv插件不仅创意好，设计的也很漂亮。

如果在comluv.com网站上注册的话，可以更新10篇文章，并可以从中选择一篇显示在回复中。

安装方式：

后台插件–>添加：CommentLuv（或点击这里从插件主页下载）
激活（设置页面汉化的还行，不设置也基本可以用。）
如果希望自己在别人（也使用该插件）的网站上回复时可以选择更多的文章，就需要到comluv.com注册

P.S.

注册后推荐别人使用还可以获得回报，通过Paypal支付，至于这个用什么货币来算，每个注册给多少，我也不怎么清楚。愿意帮我尝试一下的可以点这个地址注册： http://www.comluv.com/?ref=willin-87902

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

作者：长岛冰泪，网址：http://www.willin.org/
原文标题：WordPress插件推荐：回复中插入RSS最新文章CommentLuv
原文链接：http://www.willin.org/develop/wordpress/wp-commentluv/
(C) 长岛冰泪版权所有，转载时必须以链接形式注明作者和原始出处及本声明。

PR从1直接跳4，长岛冰泪谈谈SEO心得

长岛冰泪 — Sun, 04 Apr 2010 02:42:43 +0000

在我看来：

SEO，并不是那么轻松的一件事儿，而是无数琐碎的小事儿的堆积。

Willin.org的PR停滞在1也有快半年了，从建站第一个月到1时的兴奋，到后来近半年的无风无浪。

以前，我看到PR3的个人博客就会很嫉妒，认为那就是专家，我的水平就在PR1这个层面上。当我自己PR到4的时候，还真有点不敢接受。

说说我折腾我博客的一点心得：

先把我的板子给换了。原来的板子虽然功能很强大，但是布局很不好。外国的板子首页上经常会有什么Featured Posts功能，我个人觉得只是鸡肋。zEUS卖鞋大叔也这么说，不如放上几篇固定的公告。
而我，是把文章的内容隐藏起来，让日志标题紧凑地显示在屏幕中，有点像Google的搜索结果排版。

将首页显示日志全文改成显示摘要，并且配上缩略图（WP 2.9 之后自带这个功能）。摘要截取插件试过好多，都不大好。所以用了WP自带的这个函数。
分享给大家：

< ?php if ( function_exists("has_post_thumbnail") && has_post_thumbnail() ) { the_post_thumbnail(array(150,150), array("class" => "alignright post_thumbnail")); } ?>  //缩略图，需要主题支持
 
< ?php echo mb_strimwidth(strip_tags(apply_filters('the_content', $post->post_content)), 0, 500,"......"); ?>//摘要截500个字

head 部分无用内容减少，能放到最下边就放到最下。
文章固定链接结构为 /%category%/%postname%/ 这是从不少外国WordPress SEO 和 Theme 制作书上看来的。
网站域名换成 www.开头的，但我觉得这对SEO的影响不是很大，因为willin.org的PR也到4了。
优化内链，我用的是WP Keyword Link 插件

或许你会问，总是在自己的站内折腾。外链方面呢？

我的外链工作基本等于0.

在PR升1之前，觉得找PR高的网站交换链接会让我的排名提升得快一些。但是经常碰壁不说，效果究竟能有多好，反正我是没看出来。

SEO当然是自己的事情，不能指望这个那个一起来拉你。

总结：

自己不走，不见得别人拉得动。

接下来我打算找一个合适的友情链接显示插件，或者自己有空的时候，将友情链接整合到页面和边栏，并开放申请友情链接。前提是先友情，后链接。向林木木前辈学习。

这里是我的SEO经验分享，欢迎大家的交流和指导。

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

C#猴子选大王-单向循环链表算法

长岛冰泪 — Fri, 02 Apr 2010 11:00:25 +0000

程序说明：

环境： Visual Studio 2010 Professional / .NET Framework 4.0
与其说是一个无聊小游戏，不如说就是一个算法。
用循环链表读数，每数３个淘汰一个，循环往复，
直到确定最后一个留下的编号。

P.S.　该死的输入判断差不多占用了大半语句

下载地址： MokeyKing.zip

Willin-MonkeyKing 程序特色

优化界面设计，外观简洁、美观。
优化用户体验，如：回车键提交、TabStop顺序、进度条等。
优化程序系统，后台完成所有操作。

核心C#语句

单向循环列表声明：

        class Node
        {
            public int number;
            public Node next;
        }
        class CircularList
        {
            public Node LAST;
            public Node START;
            public CircularList()
            {
                LAST = null;
            }
            public void setup(int nosum)
            {
                Node newnode1 = new Node();
                newnode1.number = 1;
                newnode1.next = null;
                LAST = newnode1;
                START = newnode1;
                for (int no = 2; no < = nosum; no++)
                {
                    Node newnode = new Node();
                    LAST.next = newnode;
                    newnode.number = no;
                    newnode.next = null;
                    LAST = newnode;
                    LAST.next = START;
                }
            }
        }

删除语句（比较繁琐，不会优化）：

            Node current;
            Node previous;
            current = currentnode;
            int progress;
            for(int j=0;j < nosum;j++)
            {
                progress =(j+1)* 100 / nosum;
                upd(progress);
                for (int i = 1; i <= 3; i++)
                {
                   current = current.next;
                }
                taotai += current.number.ToString() +" ";
                if(j!=nosum-1) listBox1.Items.Add(taotai);
                previous = current;
                current = current.next;
                previous.next = current;
                if (current == clist.LAST)
                {
                    clist.LAST = previous;
                }
                result.Text = previous.number.ToString();
            }

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

WordPress Willin-More插件·jQuery初学

长岛冰泪 — Tue, 30 Mar 2010 09:33:26 +0000

演示：该主题下效果不太好，可以访问这里查看演示 www.willin.org/tool/willin-more/

点我查看效果

先放出下载地址：Willin-More.zip
推荐使用jQuery 1.4.2

需要在Style.css中插入如下CSS代码：

.willin-more {
	color: #FFFFFF;
	font-weight: bold;
	text-decoration: blink;
	/* 强调显示 */
	width:20%;
	padding: 5px;
	text-align: center;	
	background: #0099FF;
	cursor: pointer;
	font-family: "微软雅黑","黑体";
	border-width: 1px;
	border-color: #0050D0;
	border-style: solid;
	/*CSS3 Border圆角*/
	-khtml-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	/*CSS3 Border阴影*/
	-webkit-box-shadow:5px 2px 6px #000;
	-moz-box-shadow:5px 2px 6px #000;
	}
 
.willin-content {
	position:absolute;
	background: #FFFFFF;
	/* CSS3 透明度 80%*/
	opacity:0.8;
	width: 468px;
	text-indent: 2em;
	margin: 10px;
	padding: 10px;
	display:none; 
	z-index: 8888;
	border-width: 1px;
	border-color: #0050D0;
	border-style: solid;
	/*CSS3 断行*/
	word-wrap:break-word;
	/*CSS3 Border圆角*/
	-khtml-border-radius: 11px;
	-webkit-border-radius: 11px;
	border-radius: 11px;
	/*CSS3 Border阴影*/
	-webkit-box-shadow:5px 2px 6px #000;
	-moz-box-shadow:5px 2px 6px #000;
	/*CSS3 可控制大小*/
	resize:both;
	overflow: auto;
	}

或者将willin-more.css/willin-more.js一起上传到主题目录，在header.php中插入

核心jQuery代码

$(function(){
 
    $(".willin-more").toggle(function(){
		 //显示隐藏内容
	     $(this).next("div.willin-content").show(1000);
	     $(this).removeClass("willin-highlight");
		 //$(this).css("color","#FF0066");
		 $(this).css("font-weight","normal");
		 $(this).css("text-decoration","none");
	},function(){
		 //隐藏文字内容
	     $(this).next("div.willin-content").hide(1000);
	     $(this).addClass("willin-highlight");
		 //$(this).css("color","#FFFFFF");
		 $(this).css("font-weight","bold");
		 $(this).css("text-decoration","blink");
	})
})

回复后点击这里看效果

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

jQuery折腾一下我的WordPress

长岛冰泪 — Sun, 28 Mar 2010 07:19:19 +0000

新版的willin.org最大的变化在于，加入了jQuery。

换了一个模板，自己汉化修改的。然后很神奇的发现，我的Alexa排名终于升到前50万了。

如果想知道Willin.org或者你自己网站的Alexa排名，可以点击上图下载Alexa最新的ToolBar，站长必备的一个小工具。

下面来说说这次我的WP折腾记录。

1.是很IN的干掉SideBar边侧栏小工具，在js文件中加入如下jQuery代码：

//干掉边栏
$('#close-sidebar a').toggle(function(){ //选中id="close-sidebar"内的a标签的内容，即“干掉侧边栏”
	$(this).text("拯救侧边栏"); //点击此中内容后改变成“显示侧边栏”
	$('#contentright').hide(); //隐藏id="sidebar"的内容，即“侧边栏”
	$('#content').animate({width: "960px"}, 1000); //让id="content"，即主体部分的宽度伸长至960px，时间为1000毫秒
	$('#col-3').animate({width: "960px;float:left"}, 1000);
	},function(){
	$(this).text("干掉侧边栏"); //点击此中内容后改变成“关闭侧边栏”
	$('#content').animate({width: "630px"}, 800); //让id="content"，即主体部分的宽度缩至705px，时间为800毫秒
	$('#col-3').animate({width: "480px"}, 800);
	$('#contentright').show(); //显示id="sidebar"的内容，即“侧边栏”
});

可以参照林木木的 JQuery 学习笔记之：关闭/显示 WordPress侧边栏

2.固顶的导航栏

随着浏览器滚动的导航栏。

$(window).scroll(function(){
	var scrollTop = $(window).scrollTop();
	if(scrollTop > 185)
		$('#nav').css({position:'fixed',top:'0px'}).stop().animate({'opacity':'0.8'},400);
	else
		$('#nav').css({position:'static'}).stop().animate({'opacity':'1'},400);
});
$('#menu').hover(function(){
	var scrollTop = $(window).scrollTop();
	if(scrollTop > 185){
		$('#nav').stop().animate({'opacity':'1'},400);}
	},function(){
	var scrollTop = $(window).scrollTop();
	if(scrollTop > 185){
		$('#nav').stop().animate({'opacity':'0.8'},400);
	}
});

需要设置相关CSS，我用的jQuery版本是1.3.1。

3.首页文章伸缩效果

$('.postheader').toggle(function(){
	$(this).next().slideDown(300);
	},function(){
	$(this).children("h2").children("a").text('页面载入中……');
	window.location = $(this).children("h2").children("a").attr('href');
});
$(".postheader:first").click();

CSS设置：

#postlist .post-content{display:none} /* 让id="postlist"下的class="post-content"隐藏，注意修改！ */

得益于另一个 Willin的如何使用jQuery伸缩栏位

4.隐藏功能：返回顶部

$('#top').click(function(){$('html,body').animate({scrollTop: '0px'}, 1000);return false;});

在哪里呢？自己找看看吧

5.隐藏功能：新窗口打开评论者的网站

$('.fn a').attr({ target: "_blank"});  //对class=“fn”标签内的a中添加target: "_blank"

其他功能，请自己随便找找看

折腾之后，爱上了jQuery。
向家里要钱买了3本书。只有在花钱的时候才想到家里人。是我的不对。汲汲于赚钱，却依旧未有什么收获。
在此特别推荐这本《锋利的jQuery》并附上书中源代码下载：锋利的jQuery源代码.rar

下期折腾预告：Willin的第一个WordPress模板正在设计中。

P.S. 喜欢我这个板子的可以把原版的拿去：Wp-Clear.rar

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

C#单链表通讯录1.1

长岛冰泪 — Tue, 23 Mar 2010 04:51:42 +0000

插播一条公告：域名转移到 www.willin.org 没两天，PR也到1了。继续努力。

经常有人问我，我的PR那么低为什么Alexa世界排名还不错。

答案是：因为我在用Alexa 工具栏。

环境：Visual Studio 2005 / .NET FrameWork 2.0+

特色

优化算法，无需反复文件操作。按需进行操作。
利用2个BackgroundWorker后台操作。
GUI可视化查询。
进度条和提示框人性化设计。

下载地址：通讯录Setup.zip 通讯录源代码.zip

核心代码

跨线程文件操作：

Control.CheckForIllegalCrossThreadCalls = false;

class代码：

namespace 通讯录
{
    public class Node
    {
        public string Name;
        public string Email;
        public string Phone;
        public Node next;
    }
 
    class List
    {
       public  Node START;
       public  Node LAST;
       public int max;
       public string nm;
       public string em;
       public string tel;
       public List()
        {
            START = null;
        }
 
        public void getfile()
        {
            try
            {
                FileStream test = new FileStream("bookmarks.dat", FileMode.Open);
                test.Close();
            }
            catch
            {
                FileStream newfile = new FileStream("bookmarks.dat", FileMode.Create);
                StreamWriter sw = new StreamWriter(newfile);
                sw.WriteLine("3");
                MessageBox.Show("文件不存在，创建成功！共3条记录");
                sw.WriteLine("王之琳");
                sw.WriteLine("willin@willin.org");
                sw.WriteLine("15905152929");
                sw.WriteLine("Willin");
                sw.WriteLine("willin@jit.edu.cn");
                sw.WriteLine("18905141525");
                sw.WriteLine("Lee");
                sw.WriteLine("leephy00@sina.com");
                sw.WriteLine("18905141525");
                sw.Close();
                newfile.Close();
            }
            finally
            {
                FileStream open = new FileStream("bookmarks.dat", FileMode.Open);
                StreamReader sr = new StreamReader(open);
                max = Convert.ToInt32(sr.ReadLine());
                nm = sr.ReadLine();
                em = sr.ReadLine();
                tel = sr.ReadLine();
                Node newnode1 = new Node();
                newnode1.Name = nm;
                newnode1.Email = em;
                newnode1.Phone = tel;
                newnode1.next = null;
                LAST = newnode1;
                START = newnode1;
                for (int no = 2; no &lt; = max; no++)
                {
                    nm = sr.ReadLine();
                    em = sr.ReadLine();
                    tel = sr.ReadLine();
                    Node newnode  = new Node();
                    LAST.next = newnode;
                    newnode.Name = nm;
                    newnode.Email = em;
                    newnode.Phone = tel;
                    newnode.next = null;
                    LAST = newnode;
                }
                sr.Close();
                open.Close();
            }
        }
 
    }
}

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

版权声明

电脑上三潴（3GQQ/QQ家园）不用代理

长岛冰泪 — Thu, 18 Mar 2010 13:21:33 +0000

需要的软件： Safari 4

IP Hunter太浪费时间，IP可用时间太短。

自动代理程序可能会挂马，或者广告一大片。

您可以自由：

复制、发行、展览、表演、放映、广播或通过信息网络传播本作品

惟须遵守下列条件：

署名 — 您必须按照作者或者许可人指定的方式对作品进行署名。

非商业性使用 — 您不得将本作品用于商业目的。

禁止演绎 — 您不得修改、转换或者以本作品为基础进行创作。

优势：

无需插件
无广告
免费
不用代理
操作简单

废话不多说，开始教程。根据我的步骤来，看不清楚的可以点击图片放大。

首先，在工具栏中选择开发-用户代理-Mobile Safiri 3.0——iPhone

如果没有菜单栏的点击右上角小齿轮，选择显示菜单栏
如果没有显示开发菜单，按ctrl+,在偏好设置内勾选显示开发菜单

此开发者工具将本机浏览器环境模拟成iPhone 手机浏览器。但IP地址不变化，本机IP查询可以登陆 MYIP.CN

如下图，看，本机IP仍是电信ADSL。

登陆 iphone.3g.qq.com

QQ社区（家园）

截图如下：

可以多标签页登陆多个QQ，每一个标签页都按此步骤把代理设置改成 iPhone的就可以了。

如果你是所谓的傻猪联盟的什么傻猪黑客，那你赶紧先搜罗全世界所有的杀毒软件先检测一下该软件是否有毒，否则把你们二手的破电脑给折腾坏了我怕你太心疼。是不？

P.S.

如果还有其他疑问，可直接发表评论。看到后我会立刻回复。

也想要建立一个独立博客打造自我品牌吗？
如果你喜欢本文或对我的Willin OR Guy感兴趣，请订阅本博客。如何订阅？

Willin Wang » 开发Develop

Additional Learning on website2论文

xHtml instance with jQuery: Willin-Page

Description

Core Codex

版权声明

相关日志

Willin-G情侣WP博客主题1.1 BETA发布

主题说明：

调试环境：

内置插件：

版权声明

相关日志

国内的免费主机可以用吗?

版权声明

相关日志

Willin-Mood_Pro v2.0.6主题发布

介绍：

版本需求：

目前特色：

特色预告：

演示：

下载地址：

版权声明

相关日志

Willin-Mood_Pro V2即将发布

目前特色：

特色预告：

版权声明

相关日志

推荐几款FireFox插件For Wordpress主题设计

版权声明

相关日志

jQuery会自动切换的Tab选项卡Willin-Tab

先放出边栏Slide Tab的教程。

第一步：HTML下编写Tab框架

相关日志网络身价随机友链

第二步：添加CSS

第三步：添加jQuery代码

第二教程：自动切换

第一步：编写HTML

第二步：添加CSS

第三步：添加jQuery代码

版权声明

相关日志

jQuery下拉导航效果Especially For Willin-Mood

版权声明

相关日志

Wordpress主题：Willin-Mood V1.0.1发布

介绍：

版本需求：

下载地址：

版权声明

相关日志

jQuery美妙的标题提示加强版

版权声明

相关日志

Willin-Mall产品展示WP主题jQuery震撼上线

版权声明

相关日志

Willin-Mall商城jQuery主题预告

版权声明

相关日志

Eclipse 3.6下jQuery自动提示插件

版权声明

相关日志

WordPress插件推荐：回复中插入RSS最新文章CommentLuv

版权声明

相关日志

PR从1直接跳4，长岛冰泪谈谈SEO心得

版权声明

相关日志

C#猴子选大王-单向循环链表算法

程序说明：

Willin-MonkeyKing 程序特色

核心C#语句

版权声明

相关日志

WordPress Willin-More插件·jQuery初学

版权声明