TẠO LINK NHẤP NHÁY ĐỔI MÀU KHI RÊ CHUỘT VÀO
10/7/13
Khi rê chuột vào các đường linh, chúng sẽ đổi màu liên tục,... Cũng thú vị đấy chứ!
Thật ra, thủ thuật này không có gì phức tạp hay mới mẻ cả, cái phức tạp là những đoạn mã (code) tạo nên hiệu ứng. Đã có rất nhiều bài viết về thủ thật này. Nhưng nhìn chung, đều không rõ ràng, chi tiết, nên người chưa quen không áp dụng được, hoặc mã bị lỗi từ chính bài viết và không có tác dụng. Theo yêu cầu của bạn Prince Cong. Hôm nay, CCK chia sẻ cách làm cho đường link trong blog nhấp nháy, đổi màu liên tiếp khi rê chuột vào.
Bắt đầu thực hiện:
1. Đăng nhập vào blog, tới "Trang tổng quan - Thiết kế" (xem các ảnh dưới).
3. Bấm vào "Chỉnh sửa HTML" [3] sẽ hiện ra bảng HTML trong template của Blog. Nếu đợi 30 giây vẫn không hiện ra bảng HTML - bấm vào nút "Trở lại" [5], rồi bấm "Chỉnh sửa HTML" [3] một lần nữa sẽ hiện ra.
Nên copy và dán cả dòng chú thích "<!-- Bắt đầu link nhấp nháy --> <!-- Kết thúc link nhấp nháy -->" để khi cần gỡ bỏ hiệu ứng sẽ không nhầm lẫn.
<!-- Bắt đầu link nhấp nháy -->
<script type='text/javascript'>
//<![CDATA[
var rate = 20;
if (document.getElementById)
window.onerror=new Function("return true")
var objActive; // The object which event occured in
var act = 0; // Flag during the action
var elmH = 0; // Hue
var elmS = 128; // Saturation
var elmV = 255; // Value
var clrOrg; // A color before the change
var TimerID; // Timer ID
if (document.all) {
document.onmouseover = doRainbowAnchor;
document.onmouseout = stopRainbowAnchor;
}
else if (document.getElementById) {
document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
document.onmouseover = Mozilla_doRainbowAnchor;
document.onmouseout = Mozilla_stopRainbowAnchor;
}
function doRainbow(obj)
{
if (act == 0) {
act = 1;
if (obj)
objActive = obj;
else
objActive = event.srcElement;
clrOrg = objActive.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
function stopRainbow()
{
if (act) {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
function doRainbowAnchor()
{
if (act == 0) {
var obj = event.srcElement;
while (obj.tagName != 'A' && obj.tagName != 'BODY') {
obj = obj.parentElement;
if (obj.tagName == 'A' || obj.tagName == 'BODY')
break;
}
if (obj.tagName == 'A' && obj.href != '') {
objActive = obj;
act = 1;
clrOrg = objActive.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
}
function stopRainbowAnchor()
{
if (act) {
if (objActive.tagName == 'A') {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
}
function Mozilla_doRainbowAnchor(e)
{
if (act == 0) {
obj = e.target;
while (obj.nodeName != 'A' && obj.nodeName != 'BODY') {
obj = obj.parentNode;
if (obj.nodeName == 'A' || obj.nodeName == 'BODY')
break;
}
if (obj.nodeName == 'A' && obj.href != '') {
objActive = obj;
act = 1;
clrOrg = obj.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
}
function Mozilla_stopRainbowAnchor(e)
{
if (act) {
if (objActive.nodeName == 'A') {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
}
function ChangeColor()
{
objActive.style.color = makeColor();
}
function makeColor()
{
// Don't you think Color Gamut to look like Rainbow?
// HSVtoRGB
if (elmS == 0) {
elmR = elmV; elmG = elmV; elmB = elmV;
}
else {
t1 = elmV;
t2 = (255 - elmS) * elmV / 255;
t3 = elmH % 60;
t3 = (t1 - t2) * t3 / 60;
if (elmH < 60) {
elmR = t1; elmB = t2; elmG = t2 + t3;
}
else if (elmH < 120) {
elmG = t1; elmB = t2; elmR = t1 - t3;
}
else if (elmH < 180) {
elmG = t1; elmR = t2; elmB = t2 + t3;
}
else if (elmH < 240) {
elmB = t1; elmR = t2; elmG = t1 - t3;
}
else if (elmH < 300) {
elmB = t1; elmG = t2; elmR = t2 + t3;
}
else if (elmH < 360) {
elmR = t1; elmG = t2; elmB = t1 - t3;
}
else {
elmR = 0; elmG = 0; elmB = 0;
}
}
elmR = Math.floor(elmR).toString(16);
elmG = Math.floor(elmG).toString(16);
elmB = Math.floor(elmB).toString(16);
if (elmR.length == 1) elmR = "0" + elmR;
if (elmG.length == 1) elmG = "0" + elmG;
if (elmB.length == 1) elmB = "0" + elmB;
elmH = elmH + rate;
if (elmH >= 360)
elmH = 0;
return '#' + elmR + elmG + elmB;
}
//]]>
</script>
<!-- Kết thúc link nhấp nháy -->
Cuối cùng:
Bấm "Lưu mẫu" và trở lại trang chủ xem thành quả.Nên copy và dán thẳng lên blog của bạn, vì nếu dán lưu tạm vào đâu đó - mã có thể bị lỗi. Trường hợp mạng yếu, đợi lâu vẫn chưa lưu được. Bạn có thể thoát ra và mở template (đã sao lưu) bằng một công cụ soạn thảo như Notepad + +,... Sau đó thực hiện việc dán mã vào đúng vị trí như trên, lưu lại rồi thay thế template vừa dán mã cho blog của bạn. Bạn có thể tải Notepad + + tại ĐÂY.
Chúc thành công!
Nguyễn Văn Cường (Caocongkien)
24 nhận xét :
ĐỀ NGHỊ:
Không chèn các đường link có tính chất spam, quảng cáo khi bình luận!
Tất cả những bình luận có chèn link nhằm spam, quảng cáo sẽ bị Admin báo cáo lên Google - do đó sẽ bị xóa và chặn vĩnh viễn.
Những bình luận, thắc mắc - nếu viết tắt bừa bãi, viết bằng kiểu chữ "teen",... sẽ không được trả lời và có thể bị xóa.
Rất mong quý vị thấu hiểu và thông cảm!
Xin cảm ơn!
Cảm ơn bạn MTL sẻ mang về làm thử nha!
Trả lờiXóaChúc bạn ngày mới an vui!
Cảm ơn bạn đã quan tâm tới bài viết.
XóaChúc bạn thành công!
Những bài hướng dẫn kĩ thuật này hay quá Cường ạ! Mấy hôm nay có chuyện gì xảy ra không? Mình đi vắng nên không vào thăm Cường được, giờ mình mới về đây này.
Trả lờiXóaCảm ơn bạn! Không có chuyện gì ngoài chuyện mình bận thôi. Chiều vui nhé!
XóaCảm ơn em nhé,anh sẽ thử.Chúc nhiều vui,công việc thuận lợi!
Trả lờiXóaCảm ơn anh! Anh cũng vậy nhé!
XóaMấy hôm nay MC bận việc quá và gặp nhiều chuyện căng thẳng, mệt mỏi nên giờ mới sang thăm bạn nè
Trả lờiXóaChúc Bạn cuối tuần bình an, nhiều niềm vui và mọi điều tốt đẹp
Cảm ơn nhé! Mình cũng vậy, vừa nâng cấp, bảo trì mấy trang web cho khách. Đau đầu quá!...
Xóa
Trả lờiXóaNgày mới vui thật nhiều nhé!
Cảm ơn anh! Cuối tuần vui anh nhé!
XóaNhận xét này đã bị tác giả xóa.
Trả lờiXóaNhận xét này đã bị tác giả xóa.
Trả lờiXóablog của anh rất hay,em sẽ luôn theo dõi và hi vọng anh có nhiều bài viết hay hơn nữa
Trả lờiXóaCảm ơn bạn đã ghé thăm và động viên! Mình rất vui nếu những bài của mình giúp được chút ích lợi gì đó cho mọi người.
XóaChúc bạn cuối tuần vui vẻ!
Sang thăm và chúc bạn chủ nhật an lành
Trả lờiXóaCảm ơn bạn! Mình bận quá, hôm nay mới hồi âm được. Trưa vui nhé!
XóaBạn rất giỏi CNTT, mình rất khâm phục bạn. Sang nhà bạn mình học hỏi được rất nhiều điều
Trả lờiXóaHôm trước mình cài đặt tiện ích liên kết trang và bài đăng mà không ổn bạn à?
Chúc bạn mọi điều tốt đẹp
Bạn sao lưu template lại gửi tới email:caocongkien68@gmail.com . Mình sẽ làm rồi gửi lại cho bạn. Bạn chỉ cần cài lên là được.
XóaBạn cho mình xin code tạo DANH MỤC và code tạo LIÊN KẾT TRANG và BÀI ĐĂNG mình sẽ cài lại xem sao, vì mình để mất rồi nên không có nữa. Cảm ơn bạn nhiều
XóaCái này không cần code đâu chỉ là tạo nút bấm và chèn link nhãn vào là xong. Nhưng mà nói thì cũng rất dài dòng bạn à.
XóaNhững Bài Viết Rất Hữu Ích
Trả lờiXóaCám Ơn Anh Cường
utcafe.blogspot.com
Cảm ơn bạn đã ghé thăm và động viên. Mình sẽ ghé thăm blog bạn!
Xóabạn bày mình cách làm cái mục BÀI XEM NHIỀU GẦN ĐÂY ở cột bên phải như của bạn được không, mình cảm ơn
Trả lờiXóaqua dep tks
Trả lờiXóa