Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 20
  1. #1
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts

    Exclamation Change from image to text.

    Code:
    function greet() 
    {
      var hour = (new Date()).getHours();
      var when = (hour > 17) ? "evening" : ( (hour > 11) ? "afternoon" : "morning" );
      document.write('<img src="' + when + '.png" alt="Good ' + when + '">\n');}
    This script puts up a png which gives a greeting depending on the time of day. I want instead to put the greeting as text.
    It's a bit ostentacious as it is..
    I would appreciate any pointers. Site is here.

    Thank you.
    Last edited by effpeetee; 06-17-2010 at 07:20 PM.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,919
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Code:
    <script type = "text/javascript">
    function greet() {
    var hour = (new Date()).getHours();
    var when = (hour > 17) ? "evening" : ( (hour > 11) ? "afternoon" : "morning" );
    document.write('Good ' + when + '<br>')
    }
    </script>
    “Expert: a man who makes three correct guesses consecutively.” - Dr. Laurence J. Peter (American "hierarchiologist", Educator and Writer, 1919-1990)
    Last edited by Philip M; 06-17-2010 at 07:41 PM.

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,195
    Thanks
    75
    Thanked 4,341 Times in 4,307 Posts
    You answered your own question.

    Code:
    function greet() 
    {
      var hour = (new Date()).getHours();
      var when = (hour > 17) ? "evening" : ( (hour > 11) ? "afternoon" : "morning" );
      document.write('Good ' + when);
    }
    After all, the alt= of the <img> was *already* text. So just use that text and you are done.

    Want to style it?
    Code:
      document.write('<span class="greeting">Good ' + when + '</span>');
    And then add a <style> for that class.

    *********

    EDIT: *sigh* Philip just types faster.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #4
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    EDIT: *sigh* Philip just types faster.
    You are both great guys. Thanks a lot. I wish my eyes were 20 yrs younger then I could read the books that I have. Ah well.

    Time and tide wait for no man. So my own father was fond of reminding me.
    Frank.

    What would |I do without the Forum?
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #5
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,195
    Thanks
    75
    Thanked 4,341 Times in 4,307 Posts
    Quote Originally Posted by Old Pedant View Post
    EDIT: *sigh* Philip just types faster.
    And has better tag lines.

    3 consecutive correct guesses...hmmm...guess I'll never be an expert.

    3 is easy. It's the consecutive part that is hard.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #6
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    I am having problems due to my ignorance.

    This is what I get so far.

    Frank
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #7
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,195
    Thanks
    75
    Thanked 4,341 Times in 4,307 Posts
    You left out the <script>...</script> tags around the document.write!

    But you also left out the code that figures out what the value of when should be.

    ******

    You know, I think you are making a mistake doing this. It is *NEVER* going to look as good as the image version, and the text will never match the appearance of the "Welcome..." line. I truly feel you should have left good enough (which is actually much better) alone.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #8
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Thanks for your help but this is not just about looks (I agree that it already looks good enough.) but i really want to know HOW to do it.

    It is more about javascript than just about appearance. Generally, I use my site to learn how to use code. (Or what is more usual, how not to use code.)

    I still cannot make it work.

    Back to the drawing-board.

    Frank
    Last edited by effpeetee; 06-18-2010 at 07:29 AM.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #9
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,919
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    One reason why you will be having trouble is this:-

    <script language="JavaScript">
    // Source: CodeFoot.com
    function blockError(){return true;}
    window.onerror = blockError;
    </script>

    It stops debugging in its tracks. If you removed that the errors would be apparant.

    The below does the trick but I agree with Old Pedant that it will never look as good as the image version.

    Code:
    <BODY onload = "greet()">
    
    <DIV id="spacer"></DIV>
    
    <div id = "greeting"></div>
    <script type = "text/javascript">
    function greet() {
    var hour = (new Date()).getHours();
    var when = (hour > 17) ? "evening" : ( (hour > 11) ? "afternoon" : "morning" );
    document.getElementById("greeting").innerHTML = "Good " + when + "<br>";
    }
    </script>
    You also have
    <script type="text/javascript" src="greet.js"></script>
    which is redundant.

  • #10
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Thank you for your help.

    I will probably leave the original version as I agree that it is satisfactory, but I wanted to know how to make the change to text if I so desired. My command of javascript is minimal and at 84yrs old with poor sight it is not likely to improve very much without help.
    I really do appreciate all the help that i have been given. Although I designed my site overall, practically all of the successful coding has been given by members of these Coding Forums.

    I still cannot get it to work using text however.



    Regards,

    Frank
    Last edited by effpeetee; 06-18-2010 at 09:58 AM.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #11
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    This is as far as I have got to date. Any comments welcomed.

    Frank
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #12
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,919
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    </DIV>div>

  • #13
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Quote Originally Posted by Philip M View Post
    </DIV>div>
    Thanks, now corrected.

    Frank

    This is as far as I have got to date.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #14
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,195
    Thanks
    75
    Thanked 4,341 Times in 4,307 Posts
    You *really* should have used the code that Philip gave you in post #9.

    Generally, I try to avoid using document.write(). It works, but it's comparatively clumsy.

    But, anyway, if you insist on using document.write, then:
    Code:
    <html>   
    <head>
    <link rel="stylesheet" type="text/css" href="atwo.css" />
    <title>Just a test rig for experimenting.</title>
    <style type="text/css">
    #H1{
        font-size:30px;
        width:auto;
        text-align:center;
    }
    </style>
    </head>
    <body>
    <DIV id="H1">
    <script type="text/javascript">
    var hour = (new Date()).getHours();
    var when = (hour > 17) ? "Evening" : ( (hour > 11) ? "Afternoon" : "Morning" );
    document.write( "Good " + when + ". Welcome to the Taylor Website" );
    </script>
    </DIV>
    </body>
    </html>
    Why make it more complex than that? This harkens back to the code from your very first post in this thread, where you were (correctly) doing
    Code:
      var hour = (new Date()).getHours();
      var when = (hour > 17) ? "evening" : ( (hour > 11) ? "afternoon" : "morning" );
    And is essentially what I suggested in my first post in the thread.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    effpeetee (06-19-2010)

  • #15
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    You may remember that while you were on holiday? I sent you a PM because I had lost your original post. Thank you for your patience with me, But I have to learn artistic display by my "suck it and see" method. I don't have the ability to see things in my minds eye. I wish that I did.

    However, whatever I decide to leave as the final outcome, all the help received on this forum is much valued. With my poor sight and increasing age, it is the only way that I can learn.

    With the new HTML coming up. it will be possible to have better text than before so the quality difference may well narrow.
    Here's hoping.

    If you can point me to the original post I would be happy to see it again.

    Regards, Frank
    Last edited by effpeetee; 06-19-2010 at 08:34 AM.
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •