Cuộn góc Peel với hiệu ứng flash cho blogspot

Bài viết trước mình đã có giới thiệu bạn cách thực hiện thủ thuật Cuộn góc Peel cho blog với css và JQuery. Hôm nay cũng cách cuộn góc cho trang như vậy nhưng chúng ta sẽ ứng dụng flash cho hiệu úng này. Với hiệu ứng flash này có về blog bạn sẽ trông đẹp hơn, cuộn góc trông mượt hơn. Bạn có thể xem hình ảnh bên dưới hoặc click demo để thấy rỏ hơn.

DEMO >> http://client-gaincapital-tradingcentral.blogspot.com/

Hình ảnh ban đầu chưa rê chuột
Hình ảnh sau khi rê chuột


☼ Thực hiện thủ thuật

1. Đăng nhập vào tài khoản BLogger
2. Vào phần thiết kế (Design)
3. Chọn thêm tiện ích (Add gadget)
4. Thêm 1 phần tử HTMl/Javascript và thêm vào nó code bên dưới

<script type=”text/javascript”>
var ppimg = new Image();
ppimg.src = ”;

var ppo = new Object();
ppo.ad_url = escape(“http://www.traidatmui.com/“);
ppo.small_path = “http://www.swfcabin.com/swf-files/1292894738.swf”;
ppo.small_image = escape(“http://lh3.ggpht.com/_BTztXRwC9ik/TRAYA4xvBUI/AAAAAAAAF3Q/TuAufrM7zwo/small.jpg“);
ppo.big_path = ‘http://www.swfcabin.com/swf-files/1292894665.swf’;
ppo.big_image = escape(“http://lh4.ggpht.com/_BTztXRwC9ik/TRAVLUNaQPI/AAAAAAAAF3A/d9wbY-FMkF0/s576/peel.png“);

ppo.small_width = ‘100’; //độ rộng phần cuộn khi chưa rê chuột
ppo.small_height = ‘100’; //độ cao phần cuộn khi chưa rê chuột
ppo.small_params = ‘ico=’ + ppo.small_image;
ppo.big_width = “450”; //độ rộng phần cuộn khi rê chuột
ppo.big_height = “450”; //độ cao phần cuộn khi rê chuột
ppo.big_params = ‘big=’ + ppo.big_image + ‘&ad_url=’ + ppo.ad_url;
</script>

<script src=”http://traidatmui-tips.googlecode.com/files/flash_peel.js” type=”text/javascript”></script>

☼ Chỉnh code:
– Link màu xanh là phần bạn nhìn thấy ban đầu, khi chưa rê chuột vào phần cuộn góc.
– Link màu tím than là phần ảnh bạn nhìn thấy khi phần ẩn bạn rê chuột vào phần cuộn đó, nói cách khác đây là phần nằm bên dưới phần cuộn góc.
– Link màu đỏ đậm là link cho phần cuộn góc, khi người dùng click vào đây nó sẽ dẫn đến địa chỉ được thiết lập trong phần này. Bạn thay thành link mà bạn muốn.

5. Sau khi chỉnh sửa xong, bạn save tiện ích lại.

Chúc bạn thành công

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *