TẠO HIỆU ỨNG CHO LINK LIÊN KẾT (Phần 2)

Posted by chiasedamme on Thursday, August 30, 2012

Trước đây, tôi có chia sẻ với các bạn cách tạo hiệu ứng link liên kết (xem TẠI ĐÂY). 
Hôm nay, dunghennessy tiếp tục chia sẻ với các bạn cách tạo hiệu ứng cho link liên kết (phần 2). Với phần 2 này, khi các bạn rê chuột vào mỗi link liên kết thì sẽ có các chữ hoặc các symbol toả ra khá đẹp và ngộ nghĩnh.
Mời bạn bấm vào Xem thử phía dưới để thấy rõ hơn hiệu ứng này.

Xem thử

Để làm được điều này, các bạn đăng nhập vào blog > Chọn thiết kế (nếu sử dụng giao diện mới thì các bạn chọn thẻ Bố cục), sau đó thêm tiện ích HTML/Javacript (nếu các bạn chưa biết thì xem cách thêm tiện ích HTML TẠI ĐÂY).
Sau đó dán toàn bộ các code dưới vào.



<script>

///////////////////////////////////////////////////////////////////////////
// CONFIGURATION STARTS HERE
///////////////////////////////////////////////////////////////////////////
      
// Đặt số lượng chữ hiển thị theo ý thích của bạn 
var sparklenumber=20

// Đặt lại font chữ theo ý thích của bạn
var sparklefont=new Array("Arial","Times","Comic Sans MS")

// Đặt lại kích thước chữ theo ý thích của bạn
var sparklesize=new Array(5,10,15,20)

// Đặt lại mã màu theo ý thích
var sparklecolor=new Array("#FF0000","#0000FF","#00FF00","#000000")

// Đặt lại tốc độ theo ý thích của bạn (số càng lớn tốc độ càng chậm)
var speed=20

///////////////////////////////////////////////////////////////////////////
// CONFIGURATION ENDS HERE
///////////////////////////////////////////////////////////////////////////

// Do not edit below this line
var sparklesizeNS4=new Array()
var x_sparklepos
var y_sparklepos
var x,y
var x_random=new Array()
var y_random=new Array()
var max_explsteps=80
var i_explsteps=0
var i_color=0
var i_size=0
var i_font=0
var marginbottom
var marginright
var sparklewidth=20
var sparkleheight=20
var isloaded=false

var browserinfos=navigator.userAgent
var ie4=document.all&&!document.getElementById&&!browserinfos.match(/Opera/)
var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/)
var ns4=document.layers
var ns6=!document.all&&document.getElementById&&!browserinfos.match(/Opera/)
var opera=browserinfos.match(/Opera/)
var browserok=ie4||ie5||ns4||ns6||opera

function initlinkexploder() {
    isloaded=true
}

function startexplosion(whatword) {
    if (isloaded) {
        i_explsteps=0
        x_sparklepos=x
        y_sparklepos=y
        for (i=0;i<=sparklenumber;i++) {
            x_random[i]=Math.ceil(20*Math.random())-10
            y_random[i]=Math.ceil(20*Math.random())-10
            while(x_random[i]>-2 && x_random[i]<2) {
                x_random[i]=Math.ceil(20*Math.random())-10
                y_random[i]=Math.ceil(20*Math.random())-10
            }
        }
        if (ie5||opera) {
            marginbottom=document.body.clientHeight
            marginright=document.body.clientWidth
        }
        if (ns6) {
            marginbottom=window.innerHeight
            marginright=window.innerWidth
        }
        for (i=0;i<=sparklenumber;i++) {
             var thisspan=document.getElementById("span"+i).style
            thisspan.visibility="VISIBLE"
            thisspan.left=x_sparklepos+"px"
            thisspan.top=y_sparklepos+"px"
            var thisspan=document.getElementById("span"+i)
            thisspan.innerHTML=whatword
            sparklewidth=parseInt(thisspan.offsetWidth)
            sparkleheight=parseInt(thisspan.offsetHeight)
        }
    explode()
    }
}


function explode() {
    if (i_explsteps<=max_explsteps) {
        for (i=0;i<=sparklenumber;i++) {  
            var thisspan=document.getElementById("span"+i).style
            if (parseInt(thisspan.left)>=marginright-sparklewidth-30+document.body.scrollLeft || parseInt(thisspan.top)>=marginbottom-sparkleheight-20+document.body.scrollTop) {
                   thisspan.left=-1000+"px"
                thisspan.top=-1000+"px"          
            }
            else {
                thisspan.visibility="VISIBLE"
                thisspan.left=parseInt(thisspan.left)+x_random[i]+"px"
                thisspan.top=parseInt(thisspan.top)+y_random[i]+"px"
            }  
        }
        i_explsteps++
        var timer=setTimeout("explode()",speed)
    }
    else {
        for (i=0;i<=sparklenumber;i++) {
            var thisspan=document.getElementById("span"+i).style
            thisspan.visibility="hidden"
        }
        clearTimeout(timer)
    }
}

function handlerMM(e){
    x = (ns4||ns6) ? e.pageX : document.body.scrollLeft+event.clientX
    y = (ns4||ns6) ? e.pageY : document.body.scrollTop+event.clientY
}


document.onmousemove=handlerMM;

document.write("<style>")
document.write(".spanstyle {")
document.write("position:absolute;")
document.write("visibility:hidden;")
document.write("}")
document.write("</style>")

for (i=0;i<=sparklenumber;i++) {
       document.write("<div id='span"+i+"' class='spanstyle' style='font-family:"+sparklefont[i_font]+";font-size:"+sparklesize[i_size]+"pt;color:"+sparklecolor[i_color]+";'>")
    document.write(".")
    document.write("</div>")
    i_color++;i_font++;i_size++;
    if (i_color>=sparklecolor.length) {i_color=0}
    if (i_font>=sparklefont.length) {i_font=0}
    if (i_size>=sparklesize.length) {i_size=0}
}
if (browserok) {
    window.onload=initlinkexploder
}
</script>



Bạn thay đổi các mã màu, font chữ, tốc độ...theo ý thích của mình (có ghi chú trên code) và bấm Lưu lại.
Bây giờ, bạn muốn link liên kết nào có hiệu ứng thì copy đoạn code này dán vào nơi bạn muốn link liên kết hiển thị (code HTML).
 <a href="Địa chỉ link liên kết" onMouseOver="startexplosion('Welcome')">Tên link liên kết</a>

Bạn thay đổi chữ Welcome thành chữ khác hoặc symblol theo ý của bạn rồi bấm Lưu và trở lại blog xem kết quả nha.



More about

Vipshock templates - Tin tức news

Posted by chiasedamme on Tuesday, August 21, 2012

Giao diện 2 cột dành cho site tin tức, thủ thuật.
Cấu trúc đơn giản gọn gàng.
load nhãn mặc định để tối ưu seo cho site.
Tóm lại là giao diện để làm site tin tức, thủ thuật ... :!^^

XEM DEMO DOWNLOAD


XEM DEMO DOWNLOAD


Cài đặt cũng như các theme share trước . mở bằng notepad++ tìm các đoạn js và thay tên nhãn cho phù hợp với nhãn blog bạn

<script>document.write("<script src=\"/feeds/posts/default/-/Tiêu điểm?max-results="+10+"&orderby=published&alt=json-in-script&callback=hotnewl\"><\/script>");</script>

Ai yêu thì để cho xin cái liên kết tới blog mình nha

<a href='http://www.bay68.com' target='_blank' title='Tham gia Hội chém gió VN'>Tham gia Hội chém gió VN</a>

Thông cảm adf buy domain nha các bạn. mới đc có 1$ còn thiếu nhiều quá!
Ai hảo tâm donate nhé :
Paypal.com: helloximo@gmail.com
Baokim.vn: nguagovt@gmail.com
Thank kiu!
More about

TẠO SLIDE SHOW TRỰC TUYẾN

Posted by chiasedamme on Monday, August 13, 2012

Bạn có thể dễ dàng tạo các slideshow ảnh từ các phần mềm hỗ trợ được khá nhiều trang mạng chia sẻ trên Web/Blog...
Nhưng nếu bạn "ngại" tải và cài đặt các phần mềm này vào máy vi tính thì trang tạo SlideShow trực tuyến là lựa chọn "tối ưu".
Tôi xin giới thiệu với các bạn một trang tạo SlideShow trực tuyến cũng khá hay đó là Photosnack. Tại trang này các bạn có thể lựa chọn cho mình một SlideShow khá đẹp mắt từ các mẫu SlideShow có sẳn của Photosnack. Mời các bạn xem một vài mẫu phía dưới.
Các bạn bấm vào thẻ Click to play của mỗi SlideShow để trải nghiệm trước nha.












Trên đây chỉ là 5 mẫu để làm minh hoạ cho bài viết, còn khá nhiều mẫu khác đang chờ bạn khám phá.
Nếu bạn có quan tâm thì bấm vào thẻ phía dưới để xem hướng dẫn và tạo SlideShow nha.




More about

TẠO BANNER CHO BẠN (Phần 2)

Posted by chiasedamme on Tuesday, August 7, 2012

Để trang trí cho Web/Blog thêm đẹp hơn, thêm sinh động hơn thì banner là thành phần không thể thiếu cho Web/Blog, tuỳ theo sở thích, nhu cầu của mỗi người mà banner có thể là một ảnh tĩnh hay một ảnh động hoặc cầu kỳ hơn là một file Flash...
Tiếp theo phần 1 (xem TẠI ĐÂY), ở phần 2 này các banner được dunghennessy cắt, ghép, nối từ những file flash khác, thêm hiệu ứng chữ, hiệu ứng nền... để tạo thành một file flash hoàn chỉnh.
Mời các bạn xem thử vài mẫu phía dưới. (do có nhiều file flash có kích thước lớn nên tốc độ load trang hơi bị chậm... ngoài ra các bạn có thể bấm xem các file flash ở chế độ toàn màn hình tương ứng phía dưới)
* Mẫu 1:
- Kích thước: 960x150
- Màu nền: Xanh lá
- Màu chữ: Cam
- Hiệu ứng chữ: Blur in
- Font chữ: Arial
- Đồng hồ: không có


* Mẫu 2:
- Kích thước: 960x150
- Màu nền: Nâu đỏ
- Màu chữ: Vàng
- Hiệu ứng chữ: Heart Beat Text
- Font chữ:VNI-Centur
- Đồng hồ: Số 4


* Mẫu 3:
- Kích thước: 960x150
- Màu nền: Xanh dương
- Màu chữ: Trắng
- Hiệu ứng chữ: Rotate Anti-Clockwise
- Font chữ:VNI-Commerce
- Đồng hồ: Không có


* Mẫu 4:
- Kích thước: 960x150
- Màu nền: Đen
- Màu chữ: Vàng
- Hiệu ứng chữ: Two Parts - Zoom out
- Font chữ: VNI-Duff
- Đồng hồ: Số 16




* Mẫu 5:
- Kích thước: 960x150
- Màu nền: Đỏ
- Màu chữ: Trắng
- Hiệu ứng chữ: Type Writer
- Font chữ: VNI-Maria
- Đồng hồ: Số 1


* Mẫu 6:
- Kích thước: 960x150
- Màu nền: Tím
- Màu chữ: Trắng
- Hiệu ứng chữ: Type Writer
- Font chữ: VNI-OngDo
- Đồng hồ: Số 89


* Mẫu 7:
- Kích thước: 960x200
- Màu nền: Không có
- Màu chữ: Đỏ
- Hiệu ứng chữ: Zoom and Rotate
- Font chữ: VNI-Truck
- Đồng hồ: Không có


* Mẫu 8:
- Kích thước: 960x200
- Màu nền: Không có
- Màu chữ: Cam
- Hiệu ứng chữ: Zoom in - X
- Font chữ: VNI-Univer
- Đồng hồ: Số 105


* Mẫu 9:
- Kích thước: 960x200
- Màu nền: Không có
- Màu chữ: Tím
- Hiệu ứng chữ: Zoom out - X
- Font chữ: VNI-Win Sample Font
- Đồng hồ: Số 46


* Mẫu 10:
- Kích thước: 960x200
- Màu nền: Đen
- Màu chữ: Trắng
- Hiệu ứng chữ: Star
- Font chữ: VNI-Univer
- Đồng hồ: Số 77

Và để tạo niềm vui nho nhỏ cho các bạn khi ghé thăm, dunghennessy sẽ tạo banner cho các bạn theo các mẫu như trên. Nếu các bạn có quan tâm vui lòng ghi rõ yêu cầu của mình vào khung comments phía dưới theo mẫu sau:
* Mẫu: ......
* Kích thước: .....
* Màu nền: .....
* Màu chữ: .....
* Dòng chữ 1: .....
* Dòng chữ 2: .....
* Hiệu ứng chữ: .....
* Font chữ: .....
* Đồng hồ: .....
* Địa chỉ mail: ...... (để tôi gởi file flash cho các bạn)

Ví dụ:
* Mẫu: 1
* Kích thước: 650x200
* Màu nền: Đen
* Màu chữ: Trắng
* Dòng chữ 1: Welcome to my Blog
* Dòng chữ 2: dunghennessy.blogspot.com
* Dòng chữ 3: Hân hạnh phục vụ các bạn
* Hiệu ứng chữ: Two Parts - Zoom out
* Font chữ: VNI-OngDo
* Đồng hồ: Số 77 (nằm bên phải).
Với yêu cầu trên, các bạn sẽ có một banner giống như vầy:



Chúc các bạn vui!!!



More about

CHỮ TỰ ĐỘNG THAY ĐỔI TRÊN THANH TIÊU ĐỀ

Posted by chiasedamme on Sunday, August 5, 2012

Trước đây, dunghennessy có chia sẻ với các bạn code làm các chữ chạy trên thanh tiêu đề (xem TẠI ĐÂY), hôm nay tôi xin chia sẻ với các bạn code làm các dòng chữ tự động thay đổi trên thanh tiêu đề theo thời gian định trước.


Mời bạn bấm vào "xem thử" phía dưới để thấy rõ hơn hiệu ứng này.

Xem thử

Rất đơn giản, bạn chỉ cần đăng nhập vào Blog > Chọn Bố cục > Thêm tiện ích HTML (nếu bạn nào chưa biết cách thêm tiện ích HTML thì mời xem BÀI NÀY) rồi dán đoạn code phía dưới vào.

<script language='javascript'>
step=0
function flash_title(){
step++
if (step==8) {step=1}
if (step==1) {document.title='Welcome to my blog!!!'}
if (step==2) {document.title='dunghennessy.blogspot.com'}
if (step==3) {document.title='Thủ thuật cho Blogspot'}
if (step==4) {document.title='Kết nối bạn bè'}
if (step==5) {document.title='Sẻ chia kinh nghiệm'}
if (step==6) {document.title='Gặt hái thành công'}
if (step==7) {document.title='Good luck!!!'}


setTimeout("flash_title()",1000);}
flash_title()
</script>

Bây giờ, các bạn thay đổi các dòng chữ theo ý thích của mình và đặt lại thời gian để chữ thay đổi ở mục setTimeout (số càng lớn chữ chạy càng chậm).

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



More about

ĐÓNG KHUNG CHO FLASH (Kiểu 3)

Posted by chiasedamme on Thursday, August 2, 2012

Flash là một thành phần không thể thiếu trên một Web/Blog, các file Flash này sẽ làm cho Web/Blog của bạn thêm sinh động hơn.
Tương tự với kiểu 1 (Xem TẠI ĐÂY) kiểu 2 (Xem TẠI ĐÂY). Với thủ thuật dưới đây, các bạn sẽ làm file Flash trông đẹp hơn nhờ vào việc đóng khung cho nó.
Bạn xem thử vài mẫu phía dưới nha:










Rất đơn giản, bạn chỉ cần đăng nhập vào Blog > Chọn Thiết kế > Thêm tiện ích HTML rồi dán đoạn code phía dưới vào.

<iframe name="cwindow" style="border:15px groove green" width=500 height=300 src="dán địa chỉ  file flash vào đây"></iframe>

Bây giờ, bạn chỉ việc thay đường link file Flash vào và thay đổi chiều rộng (Width), chiều cao (Height), bạn có thể đổi màu cho khung như: green, blue, red, orange, white, black, yellow...theo ý thích của mình. Cuối cùng bấm Lưu lại là xong.
Bạn cũng có thể áp dụng thủ thuật này để đóng khung cho ảnh cũng được, bạn xem mẫu phía dưới:












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



More about

TẠO BẢNG HIỆU HỘP ĐÈN

Posted by chiasedamme on Wednesday, August 1, 2012

Có nhiều cách để các bạn có thể "quảng bá" thương hiệu Web/Blog của mình: gắn liên kết, gắn banner...
Hôm nay mình xin chia sẻ cho các bạn cách gắn tên Web/Blog của mình vào một file Flash khá đẹp mắt. Bạn có thể dùng để trang trí blog mình thêm đẹp
Ở file flash này, tên Web/Blog của bạn sẽ hiển thị trên một bảng nhỏ và chạy theo kiểu hộp đèn kèm theo những tiếng reo hò cổ vũ cùng với tiếng nổ "đì đùng" của những ngôi sao nhỏ được bắn theo kiểu pháo bông khá đẹp...
Mời bạn xem thử bảng hiệu của dunghennessy phía dưới nha.



Đẹp không bạn???
Bạn chỉ cần đăng nhập vào blog > chọn Bố cục > thêm tiện ích HTML rồi dán code phía dưới vào.

<embed src="http://www.notcelebrity.co.uk/flashcontent/flashHeader.swf?thename=dunghennessy" type="application/x-shockwave-flash" wmode="transparent" width="680" height="350"></embed>

Bây giờ, bạn thay đổi các dòng lệnh màu đỏ để phù hợp với Web/Blog của mình, trong đó Width là chiều rộng, height là chiều cao, thay chữ dunghennessy bằng tên Web/Blog của bạn. Cuối cùng bấm Lưu và trở lại Blog xem kết quả nha...

code trên file flash có âm thanh khá lớn, vì vậy nếu muốn âm thanh nhỏ hơn, bạn copy đoạn code này thay cho code trên.


<embed src="http://www.notcelebrity.co.uk/flashcontent/flashHeader.swf?thename=dunghennessy&mute=1&skipIntro=1" type="application/x-shockwave-flash" wmode="transparent" width="680" height="350"></embed>  
Chúc các bạn vui.




More about