#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2013
    Posts
    4
    Rep Power
    0

    Smile Need help to make queuing system (counter)


    hi all,

    i have some question, how to make blinking text and ding sound , the trigger if i click (next) in queue script below :

    <html>
    <head>
    <title>Counter</title>
    <style type="text/css">
    input {
    background: #ff0;
    }
    </style>


    <script language="javascript">
    function addone(field) {
    field.value = Number(field.value) + 1;
    }

    function subtractone(field) {
    field.value = Number(field.value) - 1;
    }
    </script>
    </head>
    <body bgcolor="#FFFFFF" text="#FFFFF0">
    <font face="verdana, geneva, helvetica" size=24>
    <form name="myform">


    <input type="text" name="myfield" value="000" style="text-align:center;color:blue; font-weight:bold; font-family:Times New Roman; font size:120;height:150;width:200"><br>
    <input type="button" value=" next " style="color:red; font-weight:bold; font-family:Times New Roman; font size:15;height:40;width:50" onclick="addone(myfield);">
    <input type="button" value=" prev " style="color:red; font-weight:bold; font-family:Times New Roman; font size:15;height:40;width:50"onclick="subtractone(myfield);"><br>
    </form>
    </body>
    </html>

    also , what if i want to change the click trigger button , in to press button (like press + button) to next, and press - (to prev)

    thanks guys.
  2. #2
  3. A Not To Shabby Code Smurf
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Aug 2008
    Posts
    1,187
    Rep Power
    184
    Originally Posted by alcatraz27
    hi all,

    i have some question, how to make blinking text and ding sound , the trigger if i click (next) in queue script below
    As, for the blinking effect:

    Code:
    <html>
    <head>
    <title>Counter</title>
    <style type="text/css">
    input {
    background: #ff0;
    }
    .normal {
    color:blue;
    text-align:center;
    font-weight:bold;
    font-family:Times New Roman;
    font-size:120%;
    height:150px;
    width:200px;
    }
    .blink {
    color:yellow;
    text-align:center;
    font-weight:bold;
    font-family:Times New Roman;
    font-size:120%;
    height:150px;
    width:200px;
    }
    </style>
    
    
    <script language="javascript">
    
    function blink(define_state)
    {
     if(define_state=="disappear") {
      document.getElementById("my_field").className="blink";
     }
     else {
      document.getElementById("my_field").className="normal";  
     }
    }
    
    function startBlink()
    {
    blink('disappear');
    setTimeout("blink('')",500);
    }
    
    function addone(field) {
    startBlink();
    field.value = Number(field.value) + 1;
    }
    
    function subtractone(field) {
    startBlink();
    field.value = Number(field.value) - 1;
    }
    
    </script>
    </head>
    <body bgcolor="#FFFFFF" text="#FFFFF0">
    <font face="verdana, geneva, helvetica" size=24>
    <form name="myform">
    
    
    <input id="my_field" type="text" name="myfield" value="000" class="normal"><br>
    <input type="button" value=" next " style="color:red; font-weight:bold; font-family:Times New Roman; font size:15;height:40;width:50" onclick="addone(myfield);">
    <input type="button" value=" prev " style="color:red; font-weight:bold; font-family:Times New Roman; font size:15;height:40;width:50"onclick="subtractone(myfield);"><br>
    </form>
    </body>
    </html>
    And... as, for the sound effect; do some online research about JavaScript/HTML Sounds (specifically: "HTML5 audio tag" and "HTML Object tag" and "HTML Embed tag". I could do this for you; just as I did the blinking text, but that would impede your learning process (I did get you started though).

    Originally Posted by alcatraz27
    also , what if i want to change the click trigger button , in to press button (like press + button) to next, and press - (to prev)
    What do you mean, I do not understanding what you are talking about here?
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2013
    Posts
    4
    Rep Power
    0
    Thanks Man, it work..
  6. #4
  7. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Mar 2013
    Posts
    4
    Rep Power
    0
    btw, i want if blink text is constant , not stop blinking, can u help me ?...
  8. #5
  9. A Not To Shabby Code Smurf
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Aug 2008
    Posts
    1,187
    Rep Power
    184
    Use a setTimeout() in the startBlink() function and in that setTimeout(); set-up the function parameter; to startBlink(). Here is some further reading: https://developer.mozilla.org/en-US/...dow.setTimeout.

IMN logo majestic logo threadwatch logo seochat tools logo