Pages: 12

  2008-07-26 05:44:58

gumscumbag
» FTalker
FTalk Level: zero
113
0
1969-12-31

sayah mau share lagi nih, kali ini CSS effect dengan menggunakan MooTools Javascript Framework. nah sekarang kita akan tambahkan effect perubahan warna pada link (hover). effect nya mirip dengan [url=

sayah mau share lagi nih, kali ini CSS effect dengan menggunakan MooTools Javascript Framework. nah sekarang kita akan tambahkan effect perubahan warna pada link (hover). effect nya mirip dengan [url=http://theftalk.com/t24681-Rainbow-Text-When-Hovered.html]Rainbow Text[/url], tapi hanya 1x perubahan warna saja. mudah2an ga repost yah, kalau repost mohon maap dan delete sajah. pertama2 buka halaman profile kamu, terus copas code di bawah ke [b]addressbar[/b] lalu tekan enter. [quote]javascript:alert(MooTools.version);[/quote] kalau misalnya ada jawaban alert `[b]1.1[/b]` berarti ga usah menambah script MooTools nya. langsung aja perhatikan script dibawah ini : [spoiler] [quote][b]window.onload = function() {onProfileLoad();}[/b][/quote] [b]code 1 :[/b] buka main js kamu dan ubah fungsi window.onload nya menjadi seperti ini: [quote]window.onload = function() { onProfileLoad(); var linkStyle = $$('#flo_wrapper a'); linkStyle.each(function(element) { var fx = new Fx.Styles(element, {duration:230, wait:false}); element.addEvent('mouseenter', function(){ fx.start({ 'color': '[b]#ffffff[/b]' }); }); element.addEvent('mouseleave', function(){ fx.start({ 'color': '[b]#585858[/b]' }); }); }); }[/quote] cocokan warna mousenter(hover) dan mouseleave(out) dengan profile kamu. mouseleave color = warna original sebelum perubahan [/spoiler] kalau misalnya ga ada jawaban alert, tambahkan script MooTools di bagian [b]A[/b] sesuai referensi bang [b]Kanal[/b] [spoiler] [quote]//script loader var script1 = document.createElement("script"); script1.type = "text/javascript"; script1.src = "http://images.friendster.com/200807C/js/mootoolsv11.js"; document.getElementsByTagName("head")[0].appendChild(script1);[/quote] lalu ubah fungsi window.onload menjadi seperti [b]code 1[/b][/spoiler] [url=http://profiles.friendster.com/60643239]Demo 1[/url] FF2+ & IE7 [url=http://profiles.friendster.com/gumscumbag]Demo 2[/url] FF2+

Pages: 12

Board footer

© 2024 F Talk

Current time is 17:26

[ 12 queries - 0.024 second ]
Privacy Policy