SitePoint Sponsor

User Tag List

Results 1 to 20 of 20
  1. #1
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    "Write" whole blocks of html?

    Well I'm creating an announcement box for my forums that differs between guests and members, so I'm just wondering if there's a way javascript can write whole blocks of html codes.

    For Example

    object.method("
    <table>
    -<tr>
    --<td>
    --- Some text?
    --</td>
    -</tr>
    </table>")
    (Ignore that's the dashes, I tried to make it easier to read)

    Is there a possible way to do this?

  2. #2
    SitePoint Wizard silver trophy kyberfabrikken's Avatar
    Join Date
    Jun 2004
    Location
    Copenhagen, Denmark
    Posts
    6,157
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can't use heredoc syntax in Javascript.

    To answer the question -- You can use innerHTML to inject HTML into a document. Eg.:
    Code:
    <div id="container"></div>
    <script>
    var container = document.getElementById("container");
    container.innerHTML = "
    <table>
     <tr>
      <td>
       Some text?
      <" + "/td>
     <" + "/tr>
    <" + "/table>";
    </script>
    And you can use the [code] tag to preserve formatting, when posting on this forum.

  3. #3
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,683
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    Curses, I should look at the forum language before replying next time.
    Incorrect reply deleted

  4. #4
    Obey the Purebreed trib4lmaniac's Avatar
    Join Date
    Dec 2004
    Location
    Cornwall, UK
    Posts
    594
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by kyberfabrikken View Post
    You can't use heredoc syntax in Javascript.

    To answer the question -- You can use innerHTML to inject HTML into a document. Eg.:
    Code:
    <div id="container"></div>
    <script>
    var container = document.getElementById("container");
    container.innerHTML = "
    <table>
     <tr>
      <td>
       Some text?
      <" + "/td>
     <" + "/tr>
    <" + "/table>";
    </script>
    And you can use the [code] tag to preserve formatting, when posting on this forum.
    Sadly, you'll need to escape the newlines with JavaScript.
    Code JavaScript:
    <div id="container"></div>
    <script>
    var container = document.getElementById("container");
    container.innerHTML = "\
    <table>\
     <tr>\
      <td>\
       Some text?\
      <" + "/td>\
     <" + "/tr>\
    <" + "/table>";
    </script>
    Most browsers should be able to cope with closing tags within JavaScript strings though, I've never seen any issues with that.

  5. #5
    SitePoint Wizard silver trophy kyberfabrikken's Avatar
    Join Date
    Jun 2004
    Location
    Copenhagen, Denmark
    Posts
    6,157
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by trib4lmaniac View Post
    Most browsers should be able to cope with closing tags within JavaScript strings though, I've never seen any issues with that.
    I think it was an issue with older browsers. It's probably obsolete now.

  6. #6
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Okay thanks a lot, I think I'll be using this forums a lot

    So for every time,I make a new line I must place a slash before?

  7. #7
    SitePoint Wizard silver trophy kyberfabrikken's Avatar
    Join Date
    Jun 2004
    Location
    Copenhagen, Denmark
    Posts
    6,157
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by SetoKaze View Post
    Okay thanks a lot, I think I'll be using this forums a lot
    Go ahead -- And welcome to Sitepoint.

    Quote Originally Posted by SetoKaze View Post
    So for every time,I make a new line I must place a slash before?
    Yes, or terminate the string, and concatenate it together on the following lines. Eg.:
    Code:
    var str = "<table>";
    str += "<tr>";
    str += "  <td>";
    str += "   Some text?";
    str += "  <" + "/td>";
    str += "<" + "/tr>";
    str += "<" + "/table>";
    container.innerHTML = str;
    But using backslashes to keep the lines together is more efficient, so just stay with that.

  8. #8
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by trib4lmaniac View Post
    Most browsers should be able to cope with closing tags within JavaScript strings though
    I hope not!

    If they do, they are not HTML compliant. The character sequence '</' followed by a name start character must not occur inside a CDATA element, which is how the script element type is defined.

    It's different in XHTML, where the content type of the script element is (#PCDATA), but that only applies for real XHTML – served as an application of XML. Pretend-XHTML served as text/html, is HTML, not XHTML. It will be parsed and interpreted as HTML, so HTML rules apply.

    Note that all this applies to inline script code between <script> and </script> only. It doesn't apply to external JavaScript files.
    Birnam wood is come to Dunsinane

  9. #9
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    <div id="container"></div>
    <script>
    var container = document.getElementById("container");
    container.innerHTML = "\
    <table>\
    <tr>\
      <td>\
       Some text?\
      <" + "/td>\
    <" + "/tr>\
    <" + "/table>";
    </script>
    I'm just wondering what's the reason for separate for this? "<" + "/table>"

    I can't simply just put "</table>" ?


    Also I tried to do this
    Code:
    <div id="leftContainer"></div>
    <script ="text/javascript">
    var leftContainer=getElementById("leftContainer");
    if (loggedin()){leftContainer.innerHTML = "\
    <center>\
    <div class="row2"><span style='color:white'><" + "/b>Important Links<b><" + "/span><" + "/div>\
    <hr>\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?showtopic=219">GFX Gallery<"/a><br>\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?showtopic=210&st=0">Lethal Note RPG Sign-Up<" + "/a>\
    <" + "/center>";}
    </script>
    It doesn't work at all.
    Last edited by SetoKaze; Dec 11, 2007 at 00:34.

  10. #10
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by SetoKaze View Post
    I'm just wondering what's the reason for separate for this? "<" + "/table>"

    I can't simply just put "</table>" ?
    I just explained that in the post above yours.

    If you put '</table>' in a string in a script element, it will be interpreted as </script>, i.e., it will terminate the script element. That's because of how the content model for script is defined in the HTML DTDs.

    The simplest workaround (apart from putting scripts in external files) is to insert a backslash between the '<' and the '/': '<\/table>'.

    Quote Originally Posted by SetoKaze View Post
    Also I tried to do this
    Code:
    <div id="leftContainer"></div>
    <script ="text/javascript">
    var leftContainer=getElementById("leftContainer");
    if (loggedin()){leftContainer.innerHTML = "\
    <center>\
    <div class="row2"><span style='color:white'><" + "/b>Important Links<b><" + "/span><" + "/div>\
    <hr>\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?showtopic=219">GFX Gallery<"/a><br>\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?showtopic=210&st=0">Lethal Note RPG Sign-Up<" + "/a>\
    <" + "/center>";}
    </script>
    It doesn't work at all.
    No, because you're trying to use double quotes inside a string delimited by double quotes.

    Something like this would work.
    Code HTML4Strict:
    <script ="text/javascript">
    var leftContainer=getElementById("leftContainer");
    if (loggedin()){leftContainer.innerHTML = "\
    <center>\
    <div class=\"row2\"><span style='color:white'><b>Important Links<\/b><\/span><\/div>\
    <hr>\
    <a href=\"http://z3.invisionfree.com/LethalAnime/index.php?showtopic=219\">GFX Gallery<\/a><br>\
    <a href=\"http://z3.invisionfree.com/LethalAnime/index.php?showtopic=210&st=0\">Lethal Note RPG Sign-Up<\/a>\
    <\/center>";}
    </script>
    (Note the backslash characters I've inserted at strategic locations.)
    Birnam wood is come to Dunsinane

  11. #11
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,786
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    You can use either

    '<' + '/'

    or

    '<\/'

    in order to comply with the rule that JavaScript embedded in HTML may not contain </

    Of course if you generated the HTML properly via the DOM then there wouldn't be any < or / to cause such a problem.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  12. #12
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,683
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by felgall View Post
    Of course if you generated the HTML properly via the DOM then there wouldn't be any < or / to cause such a problem.
    Which in this particular case would look something like

    Code JavaScript:
    var leftContainer=getElementById("leftContainer");
    var center = document.createElement('center');
    var div = document.createElement('div');
    div.setAttribute('class', 'row2');
    var span = document.createElement('span');
    span.setAttribute('style', 'color:white');
    var b = document.createElement('b');
    b.appendChild(document.createTextNode('Important Links'));
    span.appendChild(b);
    div.appendChild(span);
    var a1 = document.createElement('a');
    a1.setAttribute('href', 'http://z3.invisionfree.com/LethalAnime/index.php?showtopic=219');
    a1.appendChild(document.createTextNode('GFX Gallery'));
    var a2 = document.createElement('a');
    a2.setAttribute('href', 'http://z3.invisionfree.com/LethalAnime/index.php?showtopic=210&st=0');
    a2.appendChild(document.createTextNode('Lethal Note RPG Sign-Up'));
     
    center.appendChild(div);
    center.appendChild(document.createElement('hr'));
    center.appendChild(a1);
    center.appendChild(document.createElement('br'));
    center.appendChild(a2);
     
    container.appendChild(center);

    There are of course easier ways of doing this, but they require some kind of framework. Using JQuery the center attribute would look like

    Code JavaScript:
    var center =
      $.CENTER({}
        $.DIV({ Class:"row2" },
          $.SPAN({ Style: "color: white" },
            $.B({},
              'Important Links'
            )
          )
        ),
        $.HR({}),
        $.A({ Href: 'http://z3.invisionfree.com/LethalAnime/index.php?showtopic=219' },
          'GFX Gallery'
        ),
        $.BR({}),
        $.A({ Href: 'http://z3.invisionfree.com/LethalAnime/index.php?showtopic=210&st=0' },
          'Lethal Note RPG Sign-Up'
        )
      );
    Last edited by paul_wilkins; Dec 11, 2007 at 02:52.

  13. #13
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The simplest workaround (apart from putting scripts in external files)
    So if I placed it in an external javascript file, it wouldn't have any problems?
    I can simply do this?
    Code javascript:
    [quote]
    <div id="leftContainer"></div>
    <script ="text/javascript">
    var leftContainer=getElementById("leftContainer");
    if (loggedin()){leftContainer.innerHTML = "\
    <center>\
    <div class="row2"><span style='color:white'><" + "/b>Important Links<b><" + "/span><" + "/div>\
    <hr>\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?showtopic=219">GFX Gallery<"/a><br>\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?showtopic=210&st=0">Lethal Note RPG Sign-Up<" + "/a>\
    <" + "/center>";}
    </script>[/quote]


    And thanks for the suggestions of DOM, although I don't fully understand it, and am trying to learn it right now. But thanks pmw57, it seems a lot more easier and clear reading that, than the book I'm reading right now.

  14. #14
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,683
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    No no, you can do this. Notice also the single quote for javascript string, and the double quote for the html code.

    Code HTML4Strict:
    <div id="leftContainer"></div>
    <!-- scripts typically at the very bottom of the page -->
    <script type="text/javascript" src="leftcontainer.js"></script>

    Code JavaScript:
    var leftContainer=getElementById('leftContainer');
    if (loggedin()) {
      leftContainer.innerHTML = '\
    <center>\
    <div class="row2"><span style="color:white"><b>Important Links</b></span></div>\
    <hr>\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?showtopic=219">GFX Gallery</a><br>\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?showtopic=210&st=0">Lethal Note RPG Sign-Up</a>\
    </center>';
    }

    External scripts really are a must for javascript. They make things a whole lot easier.

  15. #15
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Wait so would I still have to worry about those single quotes? or are they okay?

  16. #16
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,683
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    If you make it a common practice to use single quotes for javascript and double quotes for html, there should then be very little to worry about.

  17. #17
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ohh that's a great idea, thanks a lot!

    Btw, wouldn't i have to do http:\/\/z3.invisionfree.com\/Lethalanime
    since the / is still there?

  18. #18
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,683
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    It's only when it's at the end of the line that it's used to continue a string literal.
    It's officially not supported by the specs, but everyone supports it anyway as an extension to the specs because it's so useful.

  19. #19
    SitePoint Member
    Join Date
    Dec 2007
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ohh I see. Thanks!


    Now I'm following all of your advices and kept checking over and over, and it's still not for some reason the rightContainer isn't working, I can't see the problem :/

    Code javascript:
    <!------Announcement Box------>
     
    <table width="100%" border="0" cellpadding="2" cellspacing="0" class="tableborder"><tr>
    <td width="90%" valign="top">
    <div class='maintitle' align='left'>Lethal Anime</div>
    <table width="100%" border="0" cellspacing="1" cellpadding="4">
    <td class="row2" width="15%" valign="top">
     
     
    <div id="leftContainer"></div>
    <script type="text/javascript">
    var leftContainer=document.getElementById("leftContainer")
    if (loggedin()){leftContainer.innerHTML ="\
    <center>\
    <div class=\"row2\"><span style=\"color:white\"><\/b>Important Links<b><\/span><\/div>\
    <hr>\
    <a href=\"http://z3.invisionfree.com/LethalAnime/index.php?showtopic=219\">GFX Gallery</a><br \/>\
    <a href=\"http://z3.invisionfree.com/LethalAnime/index.php?showtopic=210&st=0\">Lethal Note RPG Sign-Up</a>\
    <\/center>"}
     
     
     
    if (!loggedin()){leftContainer.innerHTML="\
    <img src=\"http://209.85.12.227/12079/160/upload/p700086.gif\">"}
    </script>
     
     
     
    </td>
     
     
     
    <td class="row2" width="70%" valign="top">
    <div id="middleContainer"> </div>
    <script type="text/javascript">
    var middleContainer = document.getElementById("middleContainer")
    if (loggedin()){middleContainer.innerHTML = "\
    <div align=\"center\" id=\"cboxdiv\">\
    <iframe frameborder=\"0\" width=\"100%\" height=\"100\" src=\"http://www.cbox.ws/box/?boxid=1026956&amp;boxtag=5485&amp;sec=main\" marginheight=\"2\" marginwidth=\"2\" scrolling=\"auto\" allowtransparency=\"yes\" name=\"cboxmain\" style=\"border:#000000 1px solid;\" id=\"cboxmain\"><\/iframe><br\/>\
    <iframe frameborder=\"0\" width=\"100%\" height=\"55\" src=\"http://www.cbox.ws/box/?boxid=1026956&amp;boxtag=5485&amp;sec=form\" marginheight=\"2\" marginwidth=\"2\" scrolling=\"no\" allowtransparency=\"yes\" name=\"cboxform\" style=\"border:#000000 1px solid;border-top:0px\" id=\"cboxform\"><\/iframe>\
    <\/div>"}
     
    if (!loggedin()){middleContainer.innerHTML="\
    <center>\
    <span style=\"color:white\">Welcome!<\/span>\
    <hr>\
    <p>Welcome to Lethal Anime, and enjoy your stay! Here we have a great community with great members! Join in on the GFX contests or make your own battles. Talk about anime, music, writing, or other interests. Immerse yourself into the RPG\'s and get active into our community! Discuss life issues and problems or you can just Rant\'n Rave about anything!<\/p>\
    <\/center>"}
    </script>
    </td>
     
    <td class="row2" width="15%" align="right">
     
     
     
     
    <div id="rightContainer"></div>
     
    // All bottom of here Stops Working
     
    <script type="text/javascript">
    var rightContainer = document.getElementById("rightContainer")
    if (loggedin()){rightContainer.innerHTML = "\
    <table border=\"1\"><tr><td><a href=\'http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=3&sort_order=asc&sort_key=name&st=0&b=1\'>\
    <b><i>Members<\/i><\/b><\/a><br \/>\
    <a href=\'http://z3.invisionfree.com/lethalanime/index.php?act=Members&max_results=30&filter=4&sort_order=asc&sort_key=name&st=0\'>\
    <span style=\'color:white\'><b><i>Admins<\/i><\/b><\/span><\/a><br \/>\
    <a href=\'http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=9&sort_order=asc&sort_key=name&st=0&b=1\'>\
    <span style=\'color:teal\'><b><i>GFX Staff<\/i><\/b><\/span><\/a><br \/>\
    <a href=\'http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=6&sort_order=asc&sort_key=name&st=0&b=1\'>\
    <span style=\'color:green\'><b><i>RPG Managers<\/i><\/b><\/span><\/a><br \/>\
    <a href=\'http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=10&sort_order=asc&sort_key=name&st=0&b=1\'>\
    <span style=\'color:orange\'><b><i>Anime Moderators<\/i><\/b><\/span><\/a><br \/>\
    <a href=\'http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=12&sort_order=asc&sort_key=name&st=0&b=1\'>\
    <span style=\'color:grey\'><b><i>Arts Moderators<\/i><\/b><\/span><\/a><br \/>\
    <a href=\'http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=11&sort_order=asc&sort_key=name&st=0&b=1\'>\
    <span style=\'color:black\'><b><i>Gaming Moderators<\/i><\/b><\/span><\/a><br \/>\
    <a href=\'http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=5&sort_order=asc&sort_key=name&st=0&b=1\'>\
    <span style=\'color:red\'><b><i><s>Banned<\/s><\/i><\/b><\/span><\/a>\
    <\/table><\/tr><\/td>"};
     
     
     
    if (!loggedin()){rightContainer.innerHTML = "\
    <form action=\"http://z3.invisionfree.com/LethalAnime/index.php?act=Login&amp;CODE=01\" method=\"post\" name=\'LOGIN\' onsubmit=\'return ValidateForm()\'>\
    <input type=\'hidden\' name=\'referer\' value=\"http://z3.invisionfree.com/LethalAnime/index.php?" \/>
      <table>\
      <tr>\
        <td><input type=\'text\' size=\'20\' maxlength=\'64\' name=\'UserName\' class=\'forminput\' \/><\/td>\
      <\/tr>\
      <tr>\
        <td><input type=\'password\' size=\'20\' name=\'PassWord\' class=\'forminput\' \/><\/td>\
      <\/tr>\
    	<td><input type=\"submit\" name=\'submit\' value=\"Log In\" class=\'forminput\' \/><a href=\"http://z3.invisionfree.com/LethalAnime/index.php?act=Reg&CODE=00\">&nbsp\; Register?<\/a></td>\
      <tr>\
      <\/tr>\
      <\/table>\
    <\/form>"}
     
    </script>
     
    // All above stops working
     
    </td></tr></table></div></td></tr><br>
    </td></tr></table>

  20. #20
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,683
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    The quotes appear to be flipped around. It should be single quotes for javascript and double quotes for html.

    This

    Code JavaScript:
    if (!loggedin()){rightContainer.innerHTML = "\
    <form action=\"http://z3.invisionfree.com/LethalAnime/index.php?act=Login&amp;CODE=01\" method=\"post\" name=\'LOGIN\' onsubmit=\'return ValidateForm()\'>\
    <input type=\'hidden\' name=\'referer\' value=\"http://z3.invisionfree.com/LethalAnime/index.php?" \/>
    . . .

    should be

    Code JavaScript:
    if (!loggedin()) {
      rightContainer.innerHTML = '\
    <form action="http://z3.invisionfree.com/LethalAnime/index.php?act=Login&amp;CODE=01" method="post" name="LOGIN" onsubmit="return ValidateForm()">\
    <input type="hidden" name="referer" value="http://z3.invisionfree.com/LethalAnime/index.php?" />\
    . . .

    The forward slashes don't need to be escaped either. When the single quotes are used to delimit strings, about the only thing that needs to be commonly escaped are other single quotes, and perhaps \n if you need a newline.

    Other issues are:
    - It's not mandatory but javascript statements should be finished with a semi-colon
    - The table needs a TR element between TABLE and TD
    - The end of the first table has </div></td></tr><br> which should all be removed
    - The bold tags around Important Links appears to be reversed
    - <s>Banned</s> isn't actually supported. You'll be wanting <strike>Banned</strike> instead
    - The allowtransparency attribute isn't supported, so you may want to reconsider that at some stage

    So tidied up, the above html becomes

    Code HTML4Strict:
    <!------Announcement Box------>
    <table width="100%" border="0" cellpadding="2" cellspacing="0" class="tableborder">
      <tr>
        <td width="90%" valign="top"><div class="maintitle" align="left">Lethal Anime</div>
          <table width="100%" border="0" cellspacing="1" cellpadding="4">
            <tr>
              <td class="row2" width="15%" valign="top"><div id="leftContainer"></div>
              </td>
              <td class="row2" width="70%" valign="top"><div id="middleContainer"> </div>
              </td>
              <td class="row2" width="15%" align="right"><div id="rightContainer"></div>
              </td>
            </tr>
          </table></td>
      </tr>
    </table>
    <script type="text/javascript" src="containers.js"></script>

    and the javascript (currently in containers.js) is
    Code JavaScript:
    var leftContainer=document.getElementById("leftContainer");
    if (loggedin()){leftContainer.innerHTML ='\
    <center>\
    <div class="row2"><span style="color:white"><b>Important Links</b></span></div>\
    <hr>\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?showtopic=219">GFX Gallery</a><br \/>\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?showtopic=210&st=0\">Lethal Note RPG Sign-Up</a>\
    <\/center>'};
    if (!loggedin()){leftContainer.innerHTML='\
    <img src="http://209.85.12.227/12079/160/upload/p700086.gif">'};
     
    var middleContainer = document.getElementById("middleContainer");
    if (loggedin()){middleContainer.innerHTML = '\
    <div align="center" id="cboxdiv">\
    <iframe frameborder="0" width="100%" height="100" src="http://www.cbox.ws/box/?boxid=1026956&amp;boxtag=5485&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain" style="border:#000000 1px solid;" id="cboxmain"></iframe><br/>\
    <iframe frameborder="0" width="100%" height="55" src="http://www.cbox.ws/box/?boxid=1026956&amp;boxtag=5485&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform" style="border:#000000 1px solid;border-top:0px" id="cboxform"></iframe>\
    </div>'};
    if (!loggedin()){middleContainer.innerHTML='\
    <center>\
    <span style="color:white">Welcome!</span>\
    <hr>\
    <p>Welcome to Lethal Anime, and enjoy your stay! Here we have a great community with great members! Join in on the GFX contests or make your own battles. Talk about anime, music, writing, or other interests. Immerse yourself into the RPG\'s and get active into our community! Discuss life issues and problems or you can just Rant\'n Rave about anything!</p>\
    <\/center>'};
     
    var rightContainer = document.getElementById("rightContainer");
    if (loggedin()){rightContainer.innerHTML = '\
    <table border="1"><tr><td><a href="http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=3&sort_order=asc&sort_key=name&st=0&b=1">\
    <b><i>Members</i></b></a><br />\
    <a href="http://z3.invisionfree.com/lethalanime/index.php?act=Members&max_results=30&filter=4&sort_order=asc&sort_key=name&st=0">\
    <span style="color:white"><b><i>Admins</i></b></span></a><br />\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=9&sort_order=asc&sort_key=name&st=0&b=1">\
    <span style="color:teal"><b><i>GFX Staff</i></b></span></a><br />\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=6&sort_order=asc&sort_key=name&st=0&b=1">\
    <span style="color:green"><b><i>RPG Managers</i></b></span></a><br />\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=10&sort_order=asc&sort_key=name&st=0&b=1">\
    <span style="color:orange"><b><i>Anime Moderators</i></b></span></a><br />\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=12&sort_order=asc&sort_key=name&st=0&b=1">\
    <span style="color:grey"><b><i>Arts Moderators</i></b></span></a><br />\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=11&sort_order=asc&sort_key=name&st=0&b=1">\
    <span style="color:black"><b><i>Gaming Moderators</i></b></span></a><br />\
    <a href="http://z3.invisionfree.com/LethalAnime/index.php?act=Members&max_results=30&filter=5&sort_order=asc&sort_key=name&st=0&b=1">\
    <span style="color:red"><b><i><strike>Banned</strike></i></b></span></a>\
    </table></tr></td>'};
     
    if (!loggedin()){rightContainer.innerHTML = '\
    <form action="http://z3.invisionfree.com/LethalAnime/index.php?act=Login&amp;CODE=01\" method="post" name="LOGIN" onsubmit="return ValidateForm()">\
    <input type="hidden" name="referer" value="http://z3.invisionfree.com/LethalAnime/index.php?" />\
      <table>\
      <tr>\
        <td><input type="text" size="20" maxlength="64" name="UserName" class="forminput" /></td>\
      </tr>\
      <tr>\
        <td><input type="password" size="20" name="PassWord" class="forminput" /></td>\
      </tr>\
        <td><input type="submit" name="submit" value="Log In" class="forminput" /><a href="http://z3.invisionfree.com/LethalAnime/index.php?act=Reg&CODE=00">&nbsp; Register?</a></td>\
      <tr>\
      </tr>\
      </table>\
    </form>'};


Bookmarks

Posting Permissions

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