19 Juni 2008

Membuat Teks Bergerak dengan Marquee Codes

Kalian semua pasti sudah punya account di friendster, iyya kan? Hari geenee nggak punya FS, apa kata !#$#$#%$^%????

Kalau ke warnet pasti nggak lupa buka FS. Biasanya untuk balas testi, balas pesan, update profile, ganti background, apa lagi ya..? banyak dah...

Ada banyak situs yang menyediakan bermacam-macam animasi testimonial yang lebih dari sekedar kata2 belaka(^_^). Salah satunya adalah situs mynicespace. Caranya gampang koq, tinggal pilih animasi terus copy kode css di bawahnya dan paste di comment box tujuan, pasti sudah taumi semua toh?

But, pernah nggak melihat comment yang berupa teks biasa tapi bergerak2? Lucu kan.
Kali ini saya akan berbagi buat teman2 yang pengen tahu cara membuat comment bergerak2. Di bawah ini ada bermacam-macam pilihan jenis gerakan teks. Pilih salah satunya, copy lalu paste di comment box tujuan lalu ganti tulisan TEXT di kode itu dengan kata2 yang diinginkan, gampang kan?


Right To Left

<marquee>TEXT</marquee>

Left To Right

<marquee direction="right">TEXT</marquee>

Alternate

<marquee behavior="alternate">TEXT</marquee>

Up

<marquee direction="up">TEXT</marquee>

Down

<marquee direction="down">TEXT</marquee>

Up/Down Alternate

<marquee direction="up" behavior="alternate">TEXT</marquee>

Zig Zagging

<marquee
behavior="alternate" direction="up" width="80%"><marquee
direction="right">TEXT</marquee></marquee>

Alternating Zig Zagging

<marquee
behavior="alternate" direction="up" width="80%"><marquee
direction="right"
behavior="alternate">TEXT</marquee></marquee>

Colored Border Marquee

<marquee style="border:RED 2px SOLID">TEXT</marquee>

Text Bouncing Back And Forth

<marquee behavior="alternate">Your bouncing text goes here</marquee>

Change The Scrolling Speed

<marquee behavior="scroll" direction="left" scrollamount="1">
Slow scroll speed
</marquee>
<marquee behavior="scroll" direction="left" scrollamount="10">
Medium scroll speed
</marquee>
<marquee behavior="scroll" direction="left" scrollamount="20">
Fast scroll speed
</marquee>


Scrolling Images

<marquee
behavior="scroll" direction="left"><img src="PIC URL HERE"
width="100" height="100" alt="smile" /></marquee>

Mouseover Speed Marquee

<marquee onMouseover="this.scrollAmount=#"
onMouseout="this.scrollAmount=#">TEXT</marquee>

Marquee With Color Background

<marquee
direction="left" style="background:BACKGROUND COLOR"> <font
color="FONT COLOR">TEXT</font></marquee>

Marquee With Borders

<marquee style="border:BORDER COLOR 2px SOLID">YOUR TEXT HERE</marquee>

Blinking Marquee

<font size="7" color="yellow">
<strong>
<marquee scrollamount="400" scrolldelay="400">
BLINK
</marquee>
</strong>
</font>

Scrolling Text With Image Next To It

<MARQUEE>
Hi There! <IMG SRC="graphics/idocs.gif" HEIGHT=33 WIDTH=82 ALT="Idocs Guide to HTML">
</MARQUEE>

Change the Scrolling Speed

<marquee behavior="scroll" direction="left" scrollamount="1">
Slow scroll speed
</marquee>
<marquee behavior="scroll" direction="left" scrollamount="10">
Medium scroll speed
</marquee>
<marquee behavior="scroll" direction="left" scrollamount="20">
Fast scroll speed
</marquee>

Highlight Text Marquee

<marquee
behavior="alternate"
width="10%">>></marquee>TEXT<marquee
behavior="alternate" width="10%"><<</marquee>

Starts in the Middle Then goes Left

<font color="#FFFFFF"><marquee direction="left" style="background:BLUE">TEXT</marquee></font>

Waving Marquee

<marquee
behavior=alternate direction=up scrollamount=2 scrolldelay=65 height=80
style="Text-align;filter:wave(add=0,phase=1,
freq=1,strength=15,color=.FFFFFF)"><center>TEXT<br>TEXT</center></marquee>

Stops Moving When Hovered

<marquee direction="left" scrollamount="7" scrolldelay="3" width="100%" onmouseover=this.stop() onmouseout=this.
start()>

Multi Marquee

<div
align="center"> <marquee bgcolor="#000080" scrollamount=Ŗ"
direction="up" loop="true" width=൫%"> <center>
<font color="#ffffff" size="+1"><strong> TEXT HERE<br> TEXT HERE<br> TEXT HERE<br> <br>
TEXT HERE </strong></font> </center> </marquee></div>

Different Speed Marque

<marquee scrollamount="1 - 25 speed here">place your text here</marquee>

Slide In Marquee

<marquee behavior="slide" direction="left">Your slide-in text goes here</marquee>

Arrow Marquee

<marquee
behavior="alternate" width="10%">>></marquee>TEXT
TEXT<marquee behavior="alternate"
width="10%"><<</marquee>

High Tech Marquee

<MARQUEE
behavior=alternate direction=left scrollAmount=3 width="4%"><font
face=Webdings>Marh</font></MARQUEE><MARQUEE
scrollAmount=1 direction=left width="2%">| | |</MARQUEE>TEXT
TEXT<MARQUEE scrollAmount=1 direction=right width="2%">| |
|</MARQUEE><MARQUEE behavior=alternate direction=right
scrollAmount=3 width="4%"><font
face=Webdings>marh</font></MARQUEE>

Edited Height and Width Image Marquee

<marquee
behavior="alternate" direction="up" width="100%"><marquee
direction="right" behavior="alternate"><img
src="http://photos.friendster.com/photos/15/46/11496451/1_612882377l.jpg"
width="200" height="180"></marquee></marquee></a>

==========================================================

Moving Text In Shout Out Box

//Moving Shoutout Box
if ( ! attachOnLoadHandler(function () { movingCpSB();}))
window.onload = function () { movingCpSB();};
function movingCpSB() {
var marqueeCSbox = document.getElementById("cpShoutoutBox").innerHTML;
document.getElementById("cpShoutoutBox").innerHTML
="<marquee direction='left' height='100%' scrollamount='2'
onMouseOver='stop()' onMouseOut='start()'>"+
marqueeCSbox+"</marquee>";
}

Paste in your JS File.Credits to Bobcbar.

==========================================================


sumber : friendstertalk.com

Tidak ada komentar: