Life of 97's: June 2012

By Sheh Jing

复古花纹背景（1）

自制的，转载请询问博主意见

请不要擅自转载。

请点击 Ctrl+Click 到另一个网址 copy 图片 url :)

http://i1198.photobucket.com/albums/aa448/shehjing/blogger%20material/blue-black.png

http://i1198.photobucket.com/albums/aa448/shehjing/blogger%20material/green-black.png

http://i1198.photobucket.com/albums/aa448/shehjing/blogger%20material/grey-black.png

http://i1198.photobucket.com/albums/aa448/shehjing/blogger%20material/pink-black.png

http://i1198.photobucket.com/albums/aa448/shehjing/blogger%20material/purple-black.png

http://i1198.photobucket.com/albums/aa448/shehjing/blogger%20material/yellow-black.png

By Sheh Jing

- Tutorial requested by 113 & Angel -

目前没有在任何教程部落格看到这个教程，
请不要转载此教程。谢谢。

（若看不清图片，请点击部落格右方的 About / Color Codes / Links 查看效果）

注：此教程很复杂，请确保你跟着每一个步骤来做，不然就看不到效果了。

For Blog Template User

1. 设计 → 修改 HTML

2. Ctrl+F 寻找代码 <head>

3. 在 <head> 的后面添加以下代码：

<style type='text/css'>

#fade { /*--Transparent background layer--*/

display: none; /*--hidden by default--*/

background: #000;

position: fixed; left: 0; top: 0;

width: 100%; height: 100%;

opacity: .50;

z-index: 9999;

}

.popup_block{

display: none; /*--hidden by default--*/

background: #fff;

padding: 20px;

border: 15px solid #FFE5A8;

float: left;

font-size: 13px;

position: fixed;

top: 50%; left: 50%;

z-index: 99999;

/*--CSS3 Box Shadows--*/

-webkit-box-shadow: 0px 0px 20px #fff;

-moz-box-shadow: 0px 0px 20px #fff;

box-shadow: 0px 0px 20px #fff;

/*--CSS3 Rounded Corners--*/

-webkit-border-radius: 10px;

-moz-border-radius: 10px;

border-radius: 10px;

}

img.btn_close {

float: right;

margin: -25px -25px 0 0;

}

/*--Making IE6 Understand Fixed Positioning--*/

*html #fade {

position: absolute;

}

*html .popup_block {

position: absolute;

}

</style>

红色代码：页面的背景色
蓝色代码：页面边框代码
紫色代码：页面字体大小

4. 保存。之后再到设计 → 页面元素 → 添加小工具 → HTML / JavaScript

5. 添加以下的代码：

<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

<script>
$(document).ready(function() {
//When you click on a link with class of poplight and the href starts with a #
$('a.poplight[href^=#]').click(function() {
var popID = $(this).attr('rel'); //Get Popup Name
var popURL = $(this).attr('href'); //Get Popup href to define size

//Pull Query & Variables from href URL
var query= popURL.split('?');
var dim= query[1].split('&');
var popWidth = dim[0].split('=')[1]; //Gets the first query string value

//Fade in the Popup and add close button
$('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="图片 url" class="btn_close" title="Close Window" alt="Close" /></a>');

//Define margin for center alignment (vertical horizontal) - we add 80px to the height/width to accomodate for the padding and border width defined in the css
var popMargTop = ($('#' + popID).height() + 80) / 2;
var popMargLeft = ($('#' + popID).width() + 80) / 2;

//Apply Margin to Popup
$('#' + popID).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});

//Fade in Background
$('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'}) is used to fix the IE Bug on fading transparencies

return false;
});

//Close Popups and Fade Layer
$('a.close, #fade').live('click', function() { //When clicking on the close or fade layer...
$('#fade , .popup_block').fadeOut(function() {
$('#fade, a.close').remove(); //fade them both out
});
return false;
});
});
</script>

红色代码：叉叉的图片代码

6. 保存。然后再添加小工具 → HTML / JavaScript

7. 添加以下代码：

<center>

<a class='poplight' href='#?w=500' rel='1'>页面名称 1</a>

</center>

8. 保存。到设计 → 修改 HTML

9. Ctrl+F 寻找代码 <body expr:class='"loading" + data:blog.mobileClass'>

10. 在 <body expr:class='"loading" + data:blog.mobileClass'> 之后添加以下代码：

<div class='popup_block' id='1'>

内容在这里。

</div>

红色代码：页面的代号（注：很重要）
紫色代码：页面的名称（显示在博客）
蓝色代码：页面里面的内容（可更改）

小解释

一、为什么我说页面的代号很重要？

当你要你某个页面出现某个内容时，页面的代号一定要一样。

就是说，rel='1' 的页面，会出现 <div class='popup_block' id='1'> 的内容。

当然，如果你不要用 '1' 来做代号，你也可以用其他的字，例如：a / b / c / girl / boy 等。

自己容易找就好。

二、如果你要添加多个页面时，就将 ⑦ 的代码拷贝多一次，po 在同一个地方，不过，你的 rel='1' 一定要换成另外一个代码，不然就会出现一样的内容。

例：

</center>

</center>

---

内容在这里。

</div>

内容在这里。

</div>

三、如果你要以图片的方式来取代页面的名称，就添加以下的代码：

<a class='poplight' href='#?w=500' rel='1'><img src="图片 url" /></a>

Extra knowledge

在修改HTML 里面，一些代码是很正式的，跟我们平时添加的代码不一样哦、看以下的例子：

1. 分行 <br/>

2. 图片 <img src='图片 url'/>

其实也就这两个（就我们要添加的代码来说），若还有其他的，会再发布在这里。

* 每一次要保存时，建议先 ‘预览’ 看看，有时候你添加错了代码，又保存了的话，就很难找回那个代码了。所以，先 ‘预览’，看代码有没有出错，才来保存。:)

Categories: Bii の語法筆記, 關於小工具, 關於頁面

annyeohaseyo~ 大家近来好不好？
这一次上来是要分享一下我的另一个部落格：http://saranghaewords.blogspot.com/
里面放的都是我自创的小说 :)
大家有兴趣可以进去看看。

另外，说说订单呗。
目前下订单的人数还蛮多的，
可是亲们，请见谅。订单没那么快可以制作给你们，因为我真的很忙。=3

不过你们请放心。我既然答应你们会帮你们，就一定会做到。
只是需要一些些时间而已，大家不要抱怨呐、
还有，大家要把握时间下订单哦 :)
因为限期只至 2012-06-30 哦、

送上部落格的歌曲、大家晚安 ♥

Categories: Bii の隨手雜記

通告：部落格订单服务

By Sheh Jing

想了想，决定在考 PMR trial 之前，开放一下部落格订单服务。

之前有开放过，只是那些人真的超级过分，同时向两个博主下订单、paiseh~ 我很 beh tahan 咯。
不过啦，这次的订单有限期，由于 7月尾 / 8月头，就开始 trial 了。所以，订单只收到 2012-06-30. 所以大家要把握机会嗯 ;D

遇到之前那种下订单的，我真的 pekcek 死、（暗叹自己遇人不淑？XD
所以这一次下订单的朋友们，麻烦你们噜、遵守一下下一些条件嘛~ 我无条件帮你设计也（众：很伟大么？ →.→

注意：
第一，不要同时向两个不同的博主下订单，请尊重那位博主，也尊重我（毕竟没有人想要自己的心血被人当成买菜那样选）
第二，当成品制作好后，你可以选择用或不用，选择权在于你。
第三，如果你的订单是部落格设计，那么我会在设计期间关闭你的部落格（大概一 / 两天就会开回了）
第四，要求部落格设计的朋友们，麻烦加我去你们的部落格做 author（那么你们就不用怕我盗用你们的账户 / 密码了
第五，成品不满意 / 不喜欢那就算了，没有第二次更改了。
第六，填好以下订单表格，留言在这个帖子里 *p/s: 不要 send FB / 留言在 CBox 里，一概采取 54 态度

Available Order : Click to enter 图片 / 状态图 / 部落格链接 Blog Logo 图片 / Click 图片 / 鼠标 / Cbox 背景图 / 部落格设计服务

订单表格（except 部落格设计服务）
姓名：
服务：
显示的字：
动态 / 静态：
部落格网址：
面子书网址：

订单表格（部落格设计服务）
姓名：
要求系列：Main Colour：
部落格网址：
面子书网址：
Blog template / Blogskin：（选择 bs 的朋友，请确保你会编辑 HTML 哦）

- Email : bibi_angel97@hotmail.com

- 要求素材系列的朋友们，成品会直接发到你的 FB inbox / 部落格里（请 make sure 你的 FB message 是 public 的哦。）

备注：下订单的次数不限。表格留言在此帖子里。表格填妥方接受订单哦。

Categories: 博友订单