title: Adding a Skip Button to FastForward a .fadeIn / .fadeOut?
body: <p>Just to clarify, when you load my site I have a bit of text that fades in (quote), and then fades out. Afterwards a new bit of text (my brand name) fades in.</p>
  
  <p>Since I want people to have enough time to read the first text (the quote) the fade in and fade out are a bit long, however I don't want people to get impatient after visiting the site for the 5th time and having to wait every time.</p>
  
  <p>Therefore I was thinking of a "skip-like" button or text (IE: SKIP) so that they can fastforward to where the brand name fades in.</p>
  
  <p>Any help would be appreciated!!! Here's an example of what I currently have!!</p>
  
  <p><a href="http://jsfiddle.net/K6SpB/" rel="nofollow">http://jsfiddle.net/K6SpB/</a></p>
  
  <h2>HTML</h2>
  
  <pre><code>&lt;script src="http://code.jquery.com/jquery-1.4.4.min.js" type="text/javascript"&gt;&lt;/script&gt;   
  &lt;center&gt;
     &lt;div id="mytext" align="center"&gt;
        &lt;table width="100%" height="100%" cellpadding="0" cellspacing="0" border="0"&gt;
           &lt;tr&gt;
              &lt;td valign="middle" align="center"&gt;
                 &lt;table cellpadding="0" cellspacing="0" border="0"&gt;
                    &lt;tr&gt;
                       &lt;td height="200"&gt;
                          &lt;center&gt;
                             &lt;font size="4px" id="quote" color="black"&gt;THIS IS A QUOTE.&lt;/font&gt;
                             &lt;br&gt;
                             &lt;font size="12px" id="brandname" color="black"&gt;BRAND NAME.&lt;/font&gt;
                          &lt;/center&gt;
                       &lt;/td&gt;                
                    &lt;/tr&gt;    
                 &lt;/table&gt;
              &lt;/td&gt;
           &lt;/tr&gt;
        &lt;/table&gt;
     &lt;/div&gt;
  &lt;/center&gt;
  </code></pre>
  
  <h2>JAVASCRIPT</h2>
  
  <pre><code>$(document).ready(function() {
      $('#quote').hide().delay(1000).fadeIn(5000).delay(3000).fadeOut(2000);
      $('#brandname').hide().delay(11500).fadeIn(2000);
  });​
  </code></pre>
  
  <h2>CSS</h2>
  
  <pre><code>&lt;style type="text/css"&gt;
     #quote, #brandname {
        position:relative;
        display: none;
        float:center;
     }
     #mytext {
  
     }
  &lt;/style&gt;​
  </code></pre>