Jealous'❤: 2012

2012年9月2日星期日

新手须知 ‖ 什么是添加 HTML/Java Script ?

添加HTML/Java Script 就是添加一些可用或美化的代码

首先先到信息中心 ( DashBoard )
然后点击设计( Design )
也就是如下图所显示的

点击了后就会到设计 (Design) 的页面元素(Page Elements)
然后请点击页面元素(Page Elements)在页面元素
那边开一个新的小工具然后选择HTML/Java Script如下图:

点开添加HTML/JavaScript 后
我都会在教程里放入要添加的代码

拷贝那些代码后贴如里面的空白框框
就好了 =)

新手须知 ‖ 什么是Ctrl+F ??

Ctrl+F 通常都是在修改Html (Edit Html) 那边用到的
它的作用是查找

首先，先到信息中心 ( DashBoard )

然后点击设计( Design )
也就是如下图所显示的

点击了后就会到设计 (Design) 的页面元素(Page Elements)

然后请点击页面元素(Page Elements)旁的修改HTML (Edit HTML)

就如下图 :

红色框框是该注意的地方

然后请按Ctrl键 + F 键

按好了后

页面的右上角就会出现一个如下图所显示的框框

通常我都会在教程里说明要查找什么字

就把要查找的字打入框框就好了

PS # 如果我有说明要打勾扩展窗口小部件模板

意思就是要在下图所标记的地方单点一次

如下图 :

2012年8月22日星期三

文章底部 ‖ 添加静态文字以及图片

这个教程可分为静态和动态

不过动态的有可能迟些才放上来

首先，先到信息中心 ( DashBoard )

然后点击设计( Design )
也就是如下图所显示的

点击了后就会到设计 (Design) 的页面元素(Page Elements)

然后请点击页面元素(Page Elements)旁的修改HTML (Edit HTML)

就如下图 :

红色框框是该注意的地方

然后请按Ctrl键 + F 键

按好了后

页面的右上角就会出现一个如下图所显示的框框

在搜索框框的空白处

打入下面的代码

<data:post.body/>

搜索了后也许你会找到两个
我们只需用第一个所以不必管另一个

在所搜寻的代码下面放入你要的效果的代码

第①个效果

简单静态文字

<b>文字在这里</b>

</center><hr/>

第②个效果

背景图片的文字

<table width="100%"

background="背景图画 URL/Direct Link" >

<tr><td><DIV ALIGN="center"><b>你的文字在这里</b></DIV></td></tr>

</table>

第③个效果

图片

<center><img src="图画 URL/Direct Link" /></center>

这边有一下图片和图片的URL
如果喜欢可以拿 :目

图片URL : http://sl.glitter-graphics.net/pub/694/694033dhgu0ubg01.gif

图片 URL : http://sl.glitter-graphics.net/pub/365/365634ruvpqmirb5.png

图片URL : http://i1233.photobucket.com/albums/ff384/dingshuhui/chao.png

2012年7月23日星期一

小工具坊 ‖ 愿望清单 Wish List

什么是愿望清单呢 ?

愿望清单就是在部落格里很常见的小工具

就是列入下面的小工具

这个清单非常的简单 ~

步骤和前几个教程一样 ~

只是代码不同 ~

首先先到信息中心 ( DashBoard )
然后点击设计( Design )
也就是如下图所显示的

点击了后就会到设计 (Design) 的页面元素(Page Elements)
然后请点击页面元素(Page Elements)在页面元素
那边开一个新的小工具然后选择HTML/Java Script如下图:

然后放入一下的代码 ~

<form name=myform>



<input type="checkbox" name="wishlist" value="1" checked />你的愿望<br />



<input type="checkbox" name="wishlist" value="1" disabled />你的愿望<br />



<input type="checkbox" name="wishlist" value="1" checked />你的愿望<br />



<input type="checkbox" name="wishlist" value="1" checked />你的愿望<br />



 </form>

这些代码得自行更改

如何更改代码呢?

如果你想要更多的愿望 ~

就在</form> 上面添加一下代码

<input type="checkbox" name="wishlist" value="1" checked />你的愿望<br />

然后把你的愿望代替在你的愿望那边

checked 是已完成，就表示在你的愿望旁边有个勾勾

disabled 是指还没完成

记得自行更改哦 xDD

2012年7月21日星期六

鼠标效果 ‖ 多色散落的星星

这个教程和之前所教过的单色散落的星星一样

不过这个事是多色版的

效果图 :

首先先到信息中心 ( DashBoard )

然后点击设计( Design )
也就是如下图所显示的

点击了后就会到设计 (Design) 的页面元素(Page Elements)
然后请点击页面元素(Page Elements)
在页面元素那边开一个新的小工具
然后选择HTML/Java Script
如下图:

然后把下面的代码贴在那边

<script type='text/javascript'>

// <![CDATA[

function initCursor() {

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(1, 5);

var rdow=createDiv(5, 1);

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();

}}



var hex=new Array("00","14","28","3C","50","64","78","8C","A0","B4","C8","DC","F0")

var r=1

var g=1

var b=1

var seq=1

var sparkles = 35;



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();



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()*3;

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");

rainbow="#"+hex[r]+hex[g]+hex[b]

if (seq==6){

b--

if (b==0)

seq=1

}

if (seq==5){

r++

if (r==12)

seq=6

}

if (seq==4){

g--

if (g==0)

seq=5

}

if (seq==3){

b++

if (b==12)

seq=4

}

if (seq==2){

r--

if (r==0)

seq=3

}

if (seq==1){

g++

if (g==12)

seq=2

}

div.style.position="absolute";

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

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

div.style.overflow="hidden";

div.style.zIndex="10";

div.style.backgroundColor=rainbow;

return (div);

}

window.onload=function()

{

initCursor()

initImage()

startTime()

}



function initImage() {

imageId = 'menu'

image = document.getElementById(imageId);

setOpacity(image, 0);

image.style.visibility = "visible";

fadeIn(imageId,0);

}

function fadeIn(objId,opacity) {

if (document.getElementById) {

obj = document.getElementById(objId);

if (opacity <= 100) {

setOpacity(obj, opacity);

opacity += 10;

window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 120);

}

}

}

function setOpacity(obj, opacity) {

opacity = (opacity == 100)?99.999:opacity;

// IE/Win

obj.style.filter = "alpha(opacity:"+opacity+")";

// Safari<1.2, Konqueror

obj.style.KHTMLOpacity = opacity/100;

// Older Mozilla and Firefox

obj.style.MozOpacity = opacity/100;

// Safari 1.2, newer Firefox and Mozilla, CSS3

obj.style.opacity = opacity/100;

}



function changeNav(id) {

document.getElementById('content').innerHTML=document.getElementById(id).innerHTML;

document.getElementById('main').innerHTML=document.getElementById('home').innerHTML;

document.getElementById('rabbit').style.top="275px"

document.getElementById('penguin').style.top="532px"

}



function hidestatus(){

window.status=""

return true

}

// ]]>

</script>



<script type="text/javascript">

if (window.jstiming) window.jstiming.load.tick('headEnd');

</script>



<div class='navbar section' id='navbar'><div class='widget navbar' id='navbar1'><script type="text/javascript">

function setAttributeOnload(object, attribute, val) {

if(window.addEventListener) {

window.addEventListener("load",

function(){ object[attribute] = val; }, false);

} else {

window.attachEvent('onload', function(){ object[attribute] = val; });

}

}

function showRelatedContent(args) {

var el = document.getElementById('related-iframe');

if (el.parentNode.style.display != 'none') {

el.parentNode.style.display = 'none';

document.onclick = showRelatedContent.prevOnClick;

return;

}



var match = /(?:^[?]|&)c=([0-9]+)(?:&|(?!.))/.exec(args);

if (match !== null) {

document.getElementById('related-loading').style.left = match[1] + 'px';

el.style.left = Math.max(0, match[1] - parseInt(el.width) / 2) + 'px';

}

el.src = "http://www.blogger.com"

+ '/related-content.g?q='

+ window.location.href

+ '&id=' + "7792698363959436653";

el.parentNode.style.display = 'block';

showRelatedContent.prevOnClick = document.onclick;



// Hide related-content dropdown when clicking anywhere but on it.

document.onclick = function() {

var el = document.getElementById('related-iframe');

if (el.parentNode.style.display != 'none') {

el.parentNode.style.display = 'none';

}

document.onclick = showRelatedContent.prevOnClick;

};

}

</script></div></div>

完成了吗?

部落标题 ‖ 会移动的标题

会移动的标题这个帖子标题 .....

真的不知道要怎样解释这个效果嘛 ~

效果图 :

如果你看不懂上图是什么东东

你可以直接往上看的

当然不止有我用的效果 ~

还有很多其他不一样的效果

这个效果很简单 ~

大概几分钟就能完成了~

首先，现在这里去

然后跟着下图的步骤走 ~

如果看不清楚下图

单点就可以放大了

上面的步骤完成了后先按Preview查看效果是不是你想要的 ~

确定了后就按 OK,Generate Code!

然后把所显示的代码拷贝起来 ~

到信息中心 ( DashBoard )
然后点击设计( Design )
也就是如下图所显示的

点击了后就会到设计 (Design) 的页面元素(Page Elements)
然后请点击页面元素(Page Elements)
在页面元素那边开一个新的小工具
然后选择HTML/Java Script
如下图:

打开了后就把刚刚拷贝的代码贴下去

然后就大功告成啦

2012年7月14日星期六

转载素材 ‖ 精美简洁时钟

<embed src="http://www.blogclock.cn/swf/S10014498e66b1f-f.swf" Width="176px" Height="109px" type="application/x-shockwave-flash" quality="high" wmode="transparent"></embed>

<embed src='http://www.blogclock.cn/swf/S1003266d1c29d8-1.swf' Width='199px' Height='100px' type='application/x-shockwave-flash' quality='high' wmode='transparent'></embed>

<embed src='http://www.blogclock.cn/swf/S10031403d775ae-6.swf' Width='120px' Height='100px' type='application/x-shockwave-flash' quality='high' wmode='transparent'></embed>

<embed src='http://www.blogclock.cn/swf/S10031906ec70bf-9.swf' Width='150px' Height='190px' type='application/x-shockwave-flash' quality='high' wmode='transparent'></embed>

<embed src='http://www.blogclock.cn/swf/S1003108143c507-c.swf' Width='200px' Height='200px' type='application/x-shockwave-flash' quality='high' wmode='transparent'></embed>

<embed src='http://www.blogclock.cn/swf/S10030675aed2a2-2.swf' Width='184px' Height='85px' type='application/x-shockwave-flash' quality='high' wmode='transparent'></embed>

<embed src="http://www.blogclock.cn/swf/S10030279305e26-f.swf" Width="150px" Height="250px" type="application/x-shockwave-flash" quality="high" wmode="transparent"></embed>

<embed src="http://www.blogclock.cn/swf/S100198538bf674-a.swf" Width="160px" Height="120px" type="application/x-shockwave-flash" quality="high" wmode="transparent"></embed>

<embed src="http://www.blogclock.cn/swf/S100037e48dcfbd-7.swf" Width="120px" Height="48px" type="application/x-shockwave-flash" quality="high" wmode="transparent"></embed>

<embed src="http://www.blogclock.cn/swf/S1002145c8dacf4-4.swf" Width="250px" Height="300px" type="application/x-shockwave-flash" quality="high" wmode="transparent"></embed>

这些时钟要怎样用呢?
很简单 ~
先到信息中心 (Dashboard) 到设计( Design )

然后在从设计(Design)直接往下scroll （（这个小工具不用修改HTML哦 ~ 所以会方便很多 =P

打开一个新的小工具 ~

然后选择HTML/Java Script

就如下图所示 :

打开了HTML/Java Script后

把以上时钟下面的代码

贴在里面

就完成啦

订阅：评论 (Atom)

Jealous'❤

2012年9月2日星期日

新手须知 ‖ 什么是添加 HTML/Java Script ?

新手须知 ‖ 什么是Ctrl+F ??

2012年8月22日星期三

文章底部 ‖ 添加静态文字以及图片

2012年7月23日星期一

小工具坊 ‖ 愿望清单 Wish List

2012年7月21日星期六

鼠标效果 ‖ 多色散落的星星

部落标题 ‖ 会移动的标题

2012年7月14日星期六

转载素材 ‖ 精美简洁时钟

Rainbow❤

Music❤

Tittle ❤

Energy❤

Dashboard❤