Fade text in (and out)

Click "Details" to view the functions:

  <function name="FadeOutElement" parameters="element">
    JS.eval ("$(\""+element+"\").fadeOut();")
  </function>
  <function name="FadeOutElementWithDelay" parameters="element, interval">
    interval = interval * 1000
    JS.eval ("$(\""+element+"\").fadeOut(parseInt("+interval+"));")
  </function>
  <function name="FadeInText" parameters="text"><![CDATA[
    if (not HasAttribute(game, "texts_faded_in_count")) {
      game.texts_faded_in_count = 0
    }
    game.texts_faded_in_count = game.texts_faded_in_count + 1
    msg ("<span id=\"fade-in-div"+game.texts_faded_in_count+"\" style=\"display:none\">"+text+"</span>")
    JS.eval ("$(\"#fade-in-div"+game.texts_faded_in_count+"\").fadeIn();")
  ]]></function>
  <function name="FadeInTextWithDelay" parameters="text, interval"><![CDATA[
    interval = interval * 1000
    if (not HasAttribute(game, "texts_faded_in_count")) {
      game.texts_faded_in_count = 0
    }
    game.texts_faded_in_count = game.texts_faded_in_count + 1
    msg ("<span id=\"fade-in-div"+game.texts_faded_in_count+"\" style=\"display:none\">"+text+"</span>")
    JS.eval ("$(\"#fade-in-div"+game.texts_faded_in_count+"\").fadeIn(parseInt("+interval+"));")
  ]]></function>
  <function name="FadeInTextWithID" parameters="text, id"><![CDATA[
    if (not HasAttribute(game, "texts_faded_in_count")) {
      game.texts_faded_in_count = 0
    }
    game.texts_faded_in_count = game.texts_faded_in_count + 1
    msg ("<span id=\""+id+"\" style=\"display:none\">"+text+"</span>")
    JS.eval ("$(\"#"+id+"\").fadeIn();")
  ]]></function>
  <function name="FadeInTextWithDelayAndID" parameters="text, interval, id"><![CDATA[
    interval = interval * 1000
    if (not HasAttribute(game, "texts_faded_in_count")) {
      game.texts_faded_in_count = 0
    }
    game.texts_faded_in_count = game.texts_faded_in_count + 1
    msg ("<span id=\""+id+"\" style=\"display:none\">"+text+"</span>")
    JS.eval ("$(\"#"+id+"\").fadeIn(parseInt("+interval+"));")
  ]]></function>
  <function name="FadeInTextWithClass" parameters="text, class"><![CDATA[
    if (not HasAttribute(game, "texts_faded_in_count")) {
      game.texts_faded_in_count = 0
    }
    game.texts_faded_in_count = game.texts_faded_in_count + 1
    msg ("<span class=\""+class+"\" style=\"display:none\">"+text+"</span>")
    JS.eval ("$(\"."+class+"\").fadeIn();")
  ]]></function>
  <function name="FadeInTextWithDelayAndClass" parameters="text, interval, class"><![CDATA[
    interval = interval * 1000
    if (not HasAttribute(game, "texts_faded_in_count")) {
      game.texts_faded_in_count = 0
    }
    game.texts_faded_in_count = game.texts_faded_in_count + 1
    msg ("<span class=\""+class+"\" style=\"display:none\">"+text+"</span>")
    JS.eval ("$(\"."+class+"\").fadeIn(parseInt("+interval+"));")
  ]]></function>

Example:

FadeInTextWithDelayAndID ("Welcome to the game!", 2, "fadein1")
SetTimeout (3) {
  FadeOutElementWithDelay ("#fadein1", 3)
}

The first version of this caused either the command bar or the text to move when fading out (depending on whether or not text had filled the screen, placing the command bar at the bottom of the screen).

Click "Details" to view the GIF:


I have now changed it so it leaves a blank gap when the text fades out.

(I don't like the gaps, but it seems like it's less distracting this way.)

Click "Details" to view the GIF:


All comments and suggestions are more than welcome!


Pretty cool stuff KV! Wow! How do I get to be teh smarty pants?

I can think of a million ways to utilize this!

Anonynn.


Thank ya' kindly, ma'am!

--
You want to improve your skills?

Pay attention to the top 3 (in no specific order): Pixie, mrangel, and Pertex.

(You can pay attention to me sometimes, but I'm just bumbling around more often than not.)


nice :-)


This topic is now closed. Topics are closed after 60 days of inactivity.

Support

Forums