雪花栈（部落格教程，软件与IT实践）: Blogger Effect

Showing posts with label Blogger Effect. Show all posts

Monday, June 7, 2010

优化部落格文章标题

其实这个比较没那么重要~不过我还是开出来让大家知道=)
毕竟能学一个就多一个~
很多人会问什么是优化文章标题？以下我就给你1个连接参考~

http://kenchyclass.blogspot.com/2010/06/blog-post_06.html

你们看出文章标题有什么不同吗？（看不出XD）
废话不多说~
正常来说，大家的部落格标题的顺序是：

部落格教程，美化部落格（Blogger/Blogspot教程）-感谢支持者=)

而本人优化之后~标题的顺序就倒反了：

感谢支持者=)-部落格教程，美化部落格（Blogger/Blogspot教程）

据说这样的标题可以提升部落格被搜索的几率哦~
有意更改的大家~现在就开始行动吧~跟着以下步骤作

1.首先，倒Design-->Edit HTML按Ctrl+F找类是以下的代码~
<title><data:blog.pageTitle/></title>

2.将以上代码替换成:

<b:if cond='data:blog.pageType == "item"'>

<title><data:blog.pageName/> - <data:blog.title/></title>

<b:else/>

<title><data:blog.pageTitle/></title>

</b:if>

好了之后就Save起来
然后去看看你的标题吧~顺序是不是倒反了呢?

By:kenchy

阅读全文

Saturday, June 5, 2010

鼠标效果[pointer effect]（Love爱心）

这是我自制的Love效果~不过我自认做的不是很好@@喜欢的人可以使用~不喜欢的闪边去~=P
想要的人到Design-->Edit HTML里按Ctrl+F找<head>
将下面的这些代码Copy后放在<head>的下面就可以了~

<script type='text/javascript'>



// <![CDATA[



var colour="#81F7F3";



var sparkles=40;





var x=ox=400;



var y=oy=300;



var swide=800;



var shigh=600;



var sleft=sdown=0;



var tiny=new Array();



var star=new Array();



var starv=new Array();



var starx=new Array();



var stary=new Array();



var tinyx=new Array();



var tinyy=new Array();



var tinyv=new Array();



window.onload=function() { if (document.getElementById) {



var i, rats, rlef, rdow;



for (var i=0; i<sparkles; i++) {



var rats=createDiv(3, 3);



rats.style.visibility="hidden";



document.body.appendChild(tiny[i]=rats);



starv[i]=0;



tinyv[i]=0;



var rats=createDiv(5, 5);



rats.style.backgroundColor="transparent";



rats.style.visibility="hidden";



var rlef=createDiv(5, 5);



var rdow=createDiv(5, 5);



rats.appendChild(rlef);



rats.appendChild(rdow);



rlef.style.top="2px";



rlef.style.left="0px";



rdow.style.top="0px";



rdow.style.left="2px";



document.body.appendChild(star[i]=rats);



}



set_width();



sparkle();



}}



function sparkle() {



var c;



if (x!=ox || y!=oy) {



ox=x;



oy=y;



for (c=0; c<sparkles; c++) if (!starv[c]) {



star[c].style.left=(starx[c]=x)+"px";



star[c].style.top=(stary[c]=y)+"px";



star[c].style.clip="rect(0px, 5px, 5px, 0px)";



star[c].style.visibility="visible";



starv[c]=50;



break;



}



}



for (c=0; c<sparkles; c++) {



if (starv[c]) update_star(c);



if (tinyv[c]) update_tiny(c);



}



setTimeout("sparkle()", 40);



}



function update_star(i) {



if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";



if (starv[i]) {



stary[i]+=1+Math.random()*3;



if (stary[i]<shigh+sdown) {



star[i].style.top=stary[i]+"px";



starx[i]+=(i%5-2)/5;



star[i].style.left=starx[i]+"px";



}



else {



star[i].style.visibility="hidden";



starv[i]=0;



return;



}



}



else {



tinyv[i]=50;



tiny[i].style.top=(tinyy[i]=stary[i])+"px";



tiny[i].style.left=(tinyx[i]=starx[i])+"px";



tiny[i].style.width="2px";



tiny[i].style.height="2px";



star[i].style.visibility="hidden";



tiny[i].style.visibility="visible"



}



}



function update_tiny(i) {



if (--tinyv[i]==25) {



tiny[i].style.width="1px";



tiny[i].style.height="1px";



}



if (tinyv[i]) {



tinyy[i]+=1+Math.random()*5;



if (tinyy[i]<shigh+sdown) {



tiny[i].style.top=tinyy[i]+"px";



tinyx[i]+=(i%5-2)/5;



tiny[i].style.left=tinyx[i]+"px";



}



else {



tiny[i].style.visibility="hidden";



tinyv[i]=0;



return;



}



}



else tiny[i].style.visibility="hidden";



}



document.onmousemove=mouse;



function mouse(e) {



set_scroll();



y=(e)?e.pageY:event.y+sdown;



x=(e)?e.pageX:event.x+sleft;



}



function set_scroll() {



if (typeof(self.pageYOffset)=="number") {



sdown=self.pageYOffset;



sleft=self.pageXOffset;



}



else if (document.body.scrollTop || document.body.scrollLeft) {



sdown=document.body.scrollTop;



sleft=document.body.scrollLeft;



}



else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {



sleft=document.documentElement.scrollLeft;



sdown=document.documentElement.scrollTop;



}



else {



sdown=0;



sleft=0;



}



}



window.onresize=set_width;



function set_width() {



if (typeof(self.innerWidth)=="number") {



swide=self.innerWidth;



shigh=self.innerHeight;



}



else if (document.documentElement && document.documentElement.clientWidth) {



swide=document.documentElement.clientWidth;



shigh=document.documentElement.clientHeight;



}



else if (document.body.clientWidth) {



swide=document.body.clientWidth;



shigh=document.body.clientHeight;



}



}



function createDiv(height, width) {



var div=document.createElement("div");



div.style.position="absolute";



div.style.height=height+"49px";



div.style.width=width+"50px";



div.style.overflow="hidden";



div.style.backgroundColor=colour;



return (div);



}



// ]]>



</script>

#81F7F3是颜色代码，如果想更换为其它颜色请到以下网址获取你想要得颜色代码

http://www.computerhope.com/htmcolor.htm

by:kenchy

阅读全文

Friday, June 4, 2010

教你如何换鼠标(Cursor)[完整版]

之前开的Cursor教程并不是每个人都能用，有些部落格可能是背景的关系
更换了之后字体会随着便大或变得不一样，我在这里改了改
用不到的人请Copy以下的代码

<style>body {cursor:url(图片网址direct link), url(图片网址direct link), auto;} </style>

然后到Design-->Add Gadget-->Java Script/HTML
将刚才的代码放进去就可以了，记得将图片网址direct link改成你的图片网址
好了之后按Save就大功告成咯~

这个会比较简单吗？@@

by:kenchy

阅读全文

Tuesday, June 1, 2010

教你如何换鼠标(Cursor)

首先，到Design-->Edit HTML
按Ctrl+F找body {
在body {的下面放置以下的代码

cursor: url("鼠标url"), url("鼠标url"), auto;}

记得将鼠标url换成你的鼠标网址
好了之后按save就可以了=)

我暂时知道.gif/.cur/.jpg/.png都能使用
而.ani的图片我尝试后却不能，不过大家也可以尝试=)

以下提供大家以下能找到鼠标的网址：

http://www.glitter-graphics.com
http://ego-box.com/cursors/
http://www.cursors-4u.com
http://totallyfreecursors.com/

by:kenchy

阅读全文

Saturday, May 29, 2010

如何让你的连接/超连接开花

padding:7px;

background:url(http://dl6.glitter-graphics.net/pub/437/437716tvik3339uq.gif) no-repeat;

你只需要copy以上的代码
然后到

英文：Design-->Edit HTML

华文：设计-->修改HTML

按Ctrl+F找a:hover {
然后将刚才的代码放在a:hover {的下面就可以了（如图）

顺便一提~图片是能够更换的哦~
你只需要将http://dl6.glitter-graphics.net/pub/437/437716tvik3339uq.gif 更换成你的图片连接（Direct link）就可以了~

完成~简单吗？=P

By:kenchy

阅读全文

如何在连接添加Rainbow效果

Rainbow效果是怎样的？你把你的鼠标放到下面这个link上面就知道了=P

别按我~指着我就好了~=P

那颜色一直换的效果就是了~但那星星是另外的哦~
想不想要？想要的将下面这行code copy起来~

<script src='http://ggpi.googlecode.com/files/rainbow.js' type='text/javascript'/>

然后到Design-->Edit HTML
用Ctrl+F找到</head>
在</head>的上面放上刚才的代码就可以了

完成~

by:kenchy

阅读全文

Friday, May 14, 2010

鼠标效果（飘浮文字）

之前教过了一个鼠标效果，像星星一般的散落
但毕竟有时候不同的人有不同的爱好=)
在这里，给大家介绍新的一个鼠标效果~

话不多说~请看一下教程=)

首先，Login你的blogger用户
然后随着以下步骤

英文:到Design-->Add A Gadget-->HTML/JavaScript

华语:到设计-->添加小工具-->HTML/JavaScript

将以下的代码放上去就可以了

ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false;
ie4 = (document.all && !document.getElementById)? true : false;
ie5 = (document.all && document.getElementById)? true : false;
ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false;
var txtA=new Array();
text=text.split('');
var x1=0;
var y1=-1000;
var t='';

for(i=1;i<=text.length;i++){
t+=(ns4)? '<layer name="txt'+i+'" top="-100" left="0" width="'+txtw+'" height="1">' : '<div id="txt'+i+'" style="position:absolute; top:-100px; left:0px; height:1px; width:'+txtw+'; visibility:visible;">';
t+=beghtml+text[i-1]+endhtml;
t+=(ns4)? '</layer>' : '</div>';
}
document.write(t);

function moveid(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+'px';
id.style.top=y+'px';
}}

function animate(evt){
x1=Xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX);
y1=Yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY);
}

function getidleft(id){
if(ns4)return id.left;
else return parseInt(id.style.left);
}

function getidtop(id){
if(ns4)return id.top;
else return parseInt(id.style.top);
}

function getwindowwidth(){
if(ie4||ie5)return document.body.clientWidth+document.body.scrollLeft;
else return window.innerWidth+pageXOffset;
}

function movetxts(){
for(i=text.length;i>1;i=i-1){
if(getidleft(txtA[i-1])+txtw*2>=getwindowwidth()){
moveid(txtA[i-1],0,-1000);
moveid(txtA[i],0,-1000);
}else moveid(txtA[i], getidleft(txtA[i-1])+txtw, getidtop(txtA[i-1]));
}
moveid(txtA[1],x1,y1);
}

window.onload=function(){
for(i=1;i<=text.length;i++)txtA[i]=(ns4)?document.layers['txt'+i]:(ie4)?document.all['txt'+i]:document.getElementById('txt'+i);
if(ns4)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=animate;
setInterval('movetxts()',delay);
}
</script>

完

By:Kenchy

阅读全文

Tuesday, May 4, 2010

雪花效果-Snow Effect

雪花效果演示地址：http://kenchy-ruey.blogspot.com/

将以下的code加到你的部落格就可以了

英文:到Design-->Add A Gadget-->HTML/JavaScript

华语:到设计-->添加小工具-->HTML/JavaScript

放进以下的代码就可以了

By:Kenchy

阅读全文

Sunday, April 25, 2010

部落格时钟，部落格效果

许多人在找部落格时钟之类的
本人觉得[柑仔]是蛮不错的，当然最主要的是大家喜欢

浏览网址：http://blog.hastars.com/wordpress/

[柑仔]不单单只有时钟，你多翻几页，便会发现有天气预报，小游戏之类的
很多能放在部落格的几乎都能在那找到

在这里也提供大家一个美化部落格的网址
http://blogparts.spark-atv.com/treview.html

里面有雪花效果，星星效果，落叶，烟花之类的
喜欢把部落格弄得美美的人可以试试看

演示地址：http://kenchywasdead.blogspot.com/

By:Kenchy

阅读全文

Wednesday, February 24, 2010

标题滚动/闪动

第一次教学，因为有太多人问我的部落格如何做到这样那样的

这次就先教“标题闪动”吧

很简单，你只需要将以下的Code Copy

<!--

var tx = new Array (

"将你要的标题打在这",
"要加多一个的话就像这样");

var txcount=1;//1代表你只打1行，2行就打2

var i=1;

var wo=0;

var ud=1;

function animatetitle()

{

window.document.title=tx[wo].substr(0, i)+"_";

if (ud==0) i--;

if (ud==1) i++;

if (i==-1) {ud=1;i=0;wo++;wo=wo%txcount;}

if (i==tx[wo].length+10) {ud=0;i=tx[wo].length;}

// if (window.document.title.length < 20 ) window.document.title=window.document.title+"-";

// if (window.document.title.length == 20 ) window.document.title=window.document.title+"]";

// if (window.document.title.length == 21 ) setTimeout("window.document.title='Animierte Seitentitel '; ",1000);

parent.window.document.title=tx[wo].substr(0, i)+"_";

setTimeout("animatetitle()",200);

}

animatetitle();

// -->

</script>

然后Paste到你的部落格
放哪里？我教你
请按Design，然后在page elements下方找Add Gadget的字眼
按进去后你会看到很多工具，选择HTML/JavaScript把刚才Copy的Paste上去就可以了

By:Kenchy

阅读全文

鼠标效果[pointer effect](散落的星星)

By:kenchy

阅读全文

雪花栈（部落格教程，软件与IT实践）

Monday, June 7, 2010

优化部落格文章标题

Saturday, June 5, 2010

鼠标效果[pointer effect]（Love爱心）

Friday, June 4, 2010

教你如何换鼠标(Cursor)[完整版]

Tuesday, June 1, 2010

教你如何换鼠标(Cursor)

Saturday, May 29, 2010

如何让你的连接/超连接开花

如何在连接添加Rainbow效果

Friday, May 14, 2010

鼠标效果（飘浮文字）

Tuesday, May 4, 2010

雪花效果-Snow Effect

Sunday, April 25, 2010

部落格时钟，部落格效果

Wednesday, February 24, 2010

标题滚动/闪动

鼠标效果[pointer effect](散落的星星)

Search This Blog

帮我点击广告，谢谢你=)

回复排行

Labels

支持我哦~

免费广告刊登

我的连接

Labels