Demo page of MOA Text

Demo Index

Lens

Source

<div class="moatext_lens">
I have a dream ...
</div>

Try it

I have a dream that one day this nation will rise up and live out the true meaning of its creed. "We hold these truths to be self-evident: that all men are created equal."

back to TOP

Wave

Source

<div class="moatext_wave">
I have a dream ...
</div>

Try it

I have a dream that one day out in the red hills of Georgia the sons of former slaves and the sons of former slave owners will be able to sit down together at the table of brotherhood.

back to TOP

Opacity

Source

<div class="moatext_opacity">
I have a dream ...
</div>

Try it

I have a dream that one day even the state of Mississippi, a state sweltering with the heat of oppression, will be transformed into an oasis of freedom and justice.

back to TOP

Lens and Wave

Source

<script type="text/javascript" language="JavaScript"><!--
  $(function(){
    $(".moamix1").moatext({effects:["lens","wave"]});
  });
-->
</script>

<div class="moamix1">
I have a dream ...
</div>

Try it

I have a dream that my four little children will one day live in a nation where they will not be judged by the color of their skin but by their character.

back to TOP

Lens and Wave(animate by word)

Source

<script type="text/javascript" language="JavaScript"><!--
  $(function(){
    $(".moamix1w").moatext({effects:["lens","wave"],parser:jQuery.fn.moatext.parser_byword});
  });
-->
</script>

<div class="moamix1w">
I have a dream ...
</div>

Try it

I have a dream that my four little children will one day live in a nation where they will not be judged by the color of their skin but by their character.

back to TOP

Lens, Wave and Opacity

Source

<script type="text/javascript" language="JavaScript"><!--
  $(function(){
    $(".moamix2").moatext({effects:["lens","wave","opacity"]});
  });
-->
</script>

<div class="moamix2">
もちろん日本語でも大丈夫です。No problem about Japanese language.
</div>

Try it

もちろん日本語でも大丈夫です。No problem about Japanese language.

back to TOP

Original functions

Source

<script type="text/javascript" language="JavaScript"><!--
  $(function(){
    $(".moafunc").moatext({hover:[
        function(){$(this).css({
            color: "#FF0000",
            fontWeight: "bold"
        });},
        function(){$(this).css({
            color: "#000000",
            fontWeight: "normal"
        });}
    ]});
  });
-->
</script>

<div class="moafunc">
Please visit our site ...
</div>

Try it

Please visit out site

back to TOP

Omikuji

Source

<script type="text/javascript" language="JavaScript"><!--
  $(function(){
	$(".omikuji").css({opacity:"0.0"})
			.eq(Math.floor(Math.random()*3))
			.css({opacity:"1.0"})
			.moatext({
				effects:["opacity"],
				oneway:true,
				values:{opacity:{base:"0.0"}}
				});
-->
</script>

<div class="omikuji">大吉 Great blessing!</div>
<div class="omikuji">吉 Blessing!</div>
<div class="omikuji">凶 Curse!</div>

Try it

Omikuji
大吉 Great blessing!
吉 Blessing!
凶 Curse!

back to TOP

Greeting

Source

<script type="text/javascript" language="JavaScript"><!--
  $(function(){
	$(".moaoptions").moatext({
		effects: ["lens","wave","opacity"],
		values:{
			"opacity": {
				"base": "1.0",
				"enter": "0.1",
				"leave": "1.0"
			},
			"wave": {
				"enter": ["-50px","20px"]
			}
		},
		duration:2000,
		easing:"swing"
	});
  });
-->
</script>

<div class="moaoptions">Hello　こんにちは...</div>

Try it

Hello こんにちは 你好　안녕하세요 สวัสดี Merhaba Здравствуйте Ciao Bonjour Hola Buenas tardes Guten tag Hoi Hej Päivää

These greeting messages in various languages are quoted from here

back to TOP

Japanese smiley

Source

<script type="text/javascript" language="JavaScript"><!--
  $(function(){
	$(".smiley").moatext({
				effects:["lens","wave"],
				action_type: "hover"
				});
-->
</script>

<div class="smiley">(^_^)(^○^)(^-^)(^_-)-☆(^-^)</div>

Try it

(^_^)(^○^)(^-^)(^_-)-☆(^-^)

back to TOP