Solved

to make resetting smoother

Posted on 2009-07-12
5
283 Views
Last Modified: 2013-11-19
Please open the following web page. In the rectangle, click the 'display' button, letters would appear in the cells. Then click the 'reset' button.  Letters in the  top cells would disappear.  Then there is an interval during which nothing happens.  Then letters in the bottom cells disappear.

I like to see that resetting of the letters in the bottom cells takes place immediately after that in  the top cells.  There is not stop between them.

http://www.pinyinology.com/wheel/display/tryAgain2f.htm

Thanks. l
0
Comment
Question by:fuli3665
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
5 Comments
 
LVL 41

Expert Comment

by:HonorGod
ID: 24835159
The requested document was not found on this server.
0
 

Author Comment

by:fuli3665
ID: 24836391
sorry. please try the following web page:


http://www.pinyinology.com/wheel/display/tryAgain2f.html
0
 
LVL 41

Accepted Solution

by:
HonorGod earned 500 total points
ID: 24836664
Like this?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"><head> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
 
 <title>appearance of letters</title> 
 
<style type="text/css"> 
  body {margin:20px; font-size:110%;}
 
  table {border-collapse:collapse; margin-bottom:20px;}
 
  td {border:3px blue solid; width:30px; height:30px; text-align:center;}
 
#rect {border:2px red solid; padding:15px 0 15px 15px; margin-bottom:20px; width:40%; margin-top:20px;}
</style> 
 
<script type="text/javascript"> 
  var text2beshown  = new Array( 3 );
  text2beshown[ 0 ] = 'abcdefg-xyz';
  text2beshown[ 1 ] = 'CALIFORNIA';
  text2beshown[ 2 ] = 'TAMPA';
  text2beshown[ 3 ] = 'FLORIDA';
 
  var lno;
  var show = 0;
  var loc  = 0;
 
  function showLetter( loc, lno, show ) {
//  alert( 'showLetter(): ' + loc + '_' + lno + '  show: ' + show  );
    var letter = document.getElementById( 'td_' + loc + '_' + lno );
    if ( letter ) {
      letter.innerHTML = show ? text2beshown[ loc ].charAt( lno ) : ' ';
      lno++;
      if ( lno < text2beshown[ loc ].length )
        setTimeout( function() {
          showLetter( loc, lno, show )
        }, show ? 300 : 1 );
     } else {
       alert( 'Not found: td_' + loc + '_' + lno );
     }
  }
 
  function showIt( loc ) {
    showLetter( loc, 0, 1 );
  }
 
  function hideIt( loc ) {
//  alert( 'hideIt(' + loc + ')' );
    showLetter( loc, 0, 0 );
  }
 
  function show2( loc ) {
//  alert( 'show2()');
    showLetter( loc, 0, 1 );
 
    window.setTimeout(function(){
      showLetter( ++loc, 0, 1 );
    }, 300 * text2beshown[ loc ].length );
  }
 
  function hide2( loc ) {
//   alert( 'hide2()');
      showLetter( loc, 0, 0 );
 
      window.setTimeout( function() {
        showLetter( ++loc, 0, 0 );
      }, 1 )
  }
</script> 
 
</head> 
<body> 
 
<!-- abcdefg-xyz --> 
  <table> 
    <tbody> 
      <tr> 
        <script type="text/javascript"> 
          for(var i=0;i<text2beshown[0].length;i++ ){
            document.write('<td><span id="td_0_'+i+'"> </span></td>');
          }
        </script> 
      </tr> 
    </tbody> 
  </table> 
 
  <form> 
    <input value="Display" style="margin-right: 15px;" name="name1" onclick="showIt(0)" type="button"> 
    <input value="Reset" name="name2" onclick="hideIt(0)" type="button"> 
  </form> 
 
<!-- beginning of rectangle --> 
<div id='rect'> 
  <table> 
    <tr> 
      <script type="text/javascript"> 
        for( var i=0;i<text2beshown[2].length;i++ ){
          document.write('<td><span id="td_2_'+i+'"> </span></td>');
        }
      </script> 
    </tr> 
  </table> 
 
  <table> 
    <tr> 
      <script type="text/javascript"> 
        for( var i = 0; i < text2beshown[ 3 ].length;i++ ) {
          document.write( '<td><span id="td_3_' + i + '"> </span></td>');
        }
      </script> 
     </tr> 
  </table> 
 
  <form> 
    <input value="Display" type="button" onclick="show2(2)"> 
    <input value="Reset" name="name2" onclick="hide2(2)" type="button">
  </form> 
</div> 
<!-- end of tampa --> 
 
<p><b>Problem</b>: In preceding rectangle, clicking 'Display', words will appear in the cells. Then clicking 'Reset', the word 'TAMPA' will go away first. Then nothing happens for a short time. Then the word 'FLORIDA' goes away. I like to see that after the 'TAMPA' goes, the 'FLORIDA' starts to go immediately rather than waiting for a short time. 
 
</p> 
 
<!-- california --> 
<table> 
  <tr> 
    <script type="text/javascript"> 
      for( var i = 0; i < text2beshown[ 1 ].length; i++ ) {
        document.write( '<td><span id="td_1_' + i + '"> </span></td>');
      }
    </script> 
  </tr> 
</table> 
 
<form> 
 <input value="Display" style="margin-right: 15px;" name="name1" onclick="showIt(1)" type="button"> 
 
<input value="Reset" name="name2" onclick="hideIt(1)" type="button"> 
 </form> 
 
<!--
function hide2(){
       lno=0;
       show=0;
       showLetter();
 
      window.setTimeout(function(){
            lno=0;
             show=0;
            loc++;
             showLetter();
      },10)
} 
--> 
 
</body> 
</html>

Open in new window

0
 

Author Closing Comment

by:fuli3665
ID: 31602606
wonderful coding.
0
 
LVL 41

Expert Comment

by:HonorGod
ID: 24840627
Thank you for the kind words.

This was an interesting question/idea.

Thanks for that, as well as the grade & points.

Good luck & have a great day.
0

Featured Post

Command Line Tips and Tricks

The command line is a powerful tool at the disposal of every Linux user. Although Linux distros come with beautiful user interfaces, it's worthwhile to learn the command line because it allows you to do a number of things that you otherwise cannot do from the GUI.  

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Does your audience prefer people in photos or no people? How can you best highlight what you’re selling? What are your competitors doing, and what can you do that is different and unique from them?  Continue reading to learn how to make your images …
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
Viewers will get an overview of the benefits and risks of using Bitcoin to accept payments. What Bitcoin is: Legality: Risks: Benefits: Which businesses are best suited?: Other things you should know: How to get started:
In this fifth video of the Xpdf series, we discuss and demonstrate the PDFdetach utility, which is able to list and, more importantly, extract attachments that are embedded in PDF files. It does this via a command line interface, making it suitable …

632 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question