Modern/Better solution to this old Javascript?

Discussion in 'Web Design' started by Warf, Jul 3, 2018.

to remove all ads.
Tags:
  1. Warf

    Warf New Member

    Messages:
    3
    Hello, I want to create a new web page. I found some old Javascript code that I used probably 8 years ago, Which does exactly what I want to achieve on the new page.

    From what I read, Javascript is not preferred code these days, so I would like to find a modern solution to do the same thing. (or maybe the old code is fine to use today?)

    Updating the styling is not a problem, I can do that fine, I just need help to update/replace the Javascript with a valid modern equivalent.

    An example page can be seen on my website, and I would like the new code to work exactly the same if possible: www.normsweb.com/test/Pager.htm

    Any advice appreciated, thanks!
    Norm.

    Here is the code from the example page:
    Code:
    <html>
    <head>
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
    
    <style>
    body{font:Arial, Helvetica, sans-serif; margin:5px; overflow:hidden}
    td{font:Arial, Helvetica, sans-serif;}
    a.pager, a.pager:visited {color:#00f;}
    a.pager:hover {color:#f00; cursor:hand;}
    </style>
    
    <title>Title</title>
    </head>
    <body>
    <table border="2" width="100%" cellspacing="3">
        <tr>
           <td id=pageText width="100%">
            <table width="100%" border="0" cellspacing="2" cellpadding="0">
            <tr>
            <td width="80%" align="center"><strong>Main Title</strong></td>
            <td id="previous" width="10%" align="center">
            <a href="javascript:goPrev()" class="pager">Previous</a></td>
               <td id="next" width="10%" align="center">
            <a href="javascript:goNext()" class="pager">Next</a></td>
            </tr>
            </table>
        </td>
      <tr>
        <td id="pageArea" width="100%" height="200px" align="center">
    
    <div id="page0" Style="display:1;">
    Page 0 content
    </div>
    
    <div id="page1" Style="display:none;">
    Page 1 content
    </div>
    
    <div id="page2" Style="display:none;">
    Page 2 content
    </div>
    
    <div id="page3" Style="display:none;">
    Page 3 content
    </div>
    
    <div id="page4" Style="display:none;">
    Page 4 content
    </div>
    
    <div id="page5" Style="display:none;">
    Page 5 content
    </div>
    
    <div id="page6" Style="display:none;">
    Page 6 content
    </div>
    
    <div id="page7" Style="display:none;">
    Page 7 content
    </div>
    
    <div id="page8" Style="display:none;">
    Page 8 content
    </div>
    
    <div id="page9" Style="display:none;">
    Page 9 content
    </div>
    
    <div id="page10" Style="display:none;">
    Page 10 content
    </div>
    
    </td></tr>
    </table>
    
    <script>
    var i=0;
    var npages=11;
     
    function goNext()
    {
        eval("document.all.page"+i+".style.display='none'");
        i=(((i%npages)+1)%npages);
        eval("document.all.page"+i+".style.display=''");
    }
    
    function goPrev()
    {
        eval("document.all.page"+i+".style.display='none'");
        i=(((i%npages)-1)%npages);
        if (i==-1){i=10};
        eval("document.all.page"+i+".style.display=''");
        
    }
    
    </script>
    </body>
    </html>
    
    
     
  2. chrishirst

    chrishirst Well-Known Member Staff Member

    Messages:
    2,668
    javascript is the ONLY client side scripting that works across all browsers and platforms so I don't know where you got that from.
     
  3. Warf

    Warf New Member

    Messages:
    3
    Thanks for your reply.

    I read a post somewhere, and several people commented that it was a bad idea to build a web-page that NEEDED Javascript in order to work, and it was better to use PHP instead.

    I would like my page to be viewable on as many devices as possible, and wasn't sure my old Javascript solution was still a viable option.

    If my old code is still valid, then I'm happy to use it, because it works nicely for what I want to do.

    Cheers,
    Norm.
     
  4. chrishirst

    chrishirst Well-Known Member Staff Member

    Messages:
    2,668
    It USED to be a bad idea 10 - 15 years ago.
     
  5. Warf

    Warf New Member

    Messages:
    3
    Thanks for enlightening me, I will go ahead and use the old Javascript for the new page!
     

Share This Page